How does server-side rendering work with Vue, and what does Nuxt add?

Summary

With SSR, the server renders components to HTML (renderToString from vue/server-renderer), sends it so users and crawlers see content immediately, and the client then hydrates it: Vue attaches reactivity and event listeners to the existing DOM. Nuxt is the full-stack framework that handles this for you, with file-based routing, data fetching (useFetch, useAsyncData), server routes, rendering modes and deployment presets.

Longer Answer

SSR improves first contentful paint and SEO for content pages, at the cost of server load and complexity: code must be universal (no window in setup), state must be per request (no shared module-level singletons between users), and data fetched on the server must be serialised into the page for hydration. Nuxt also supports static generation, hybrid per-route rules (pre-render some routes, SSR others, client-only for dashboards) and incremental regeneration on supported hosts.

Key Points

• Server renders HTML; client hydrates.
• Better first paint and SEO.
• Universal code; per-request state.
• Nuxt: routing, data fetching, rendering modes.