What is Server-Side Rendering (SSR)?

Server-Side Rendering generates the HTML for a page on a server or edge runtime for every request, then sends the fully-rendered markup to the browser. For headless-commerce storefronts SSR is the default rendering strategy when content is highly dynamic, personalized, or needs to be SEO-friendly without waiting for client-side JavaScript.

Definition

SSR runs the same component tree that would otherwise render in the browser, but executes it on Node.js, Bun, Deno or an edge worker like Cloudflare Workers or Vercel Edge. The server fetches data from commerce, content, search and personalization APIs, produces an HTML document and ships it to the client. The browser receives a meaningful first paint quickly, then a JavaScript bundle takes over via hydration to make the page interactive. SSR is offered out of the box by Next.js, Nuxt, Remix, SvelteKit and Astro, and is often combined with caching strategies like ISR or stale-while-revalidate.

Why it matters

SSR is the safest path to good LCP and acceptable TTFB on pages where data changes too often for static-site-generation or where personalization is required. It allows search engines to index complete markup, which matters for category pages, PDPs and blog content. In composable-commerce stacks, SSR also centralizes API orchestration: the storefront server can fan-out to commerce-backend, CMS, search and recommendation services in parallel, then assemble a coherent document. This shields the client from API complexity and stabilizes Core Web Vitals.

Use cases

Typical SSR use cases include logged-in carts, localized pricing, inventory-aware PDPs and personalized landing-page variants. Headless teams on Next.js often combine SSR with React Server Components and Streaming SSR to flush early HTML while heavy data resolves. Edge Rendering on Vercel Edge or Cloudflare Workers brings SSR closer to users for global storefronts. Cache-layer strategies cache full HTML for anonymous traffic and fall back to per-request SSR for personalized sessions. SSR is rarely a binary choice anymore; modern stacks mix SSR, SSG, ISR and CSR per route to balance freshness, cost and performance.

Related

Explore Composable Headless Frontend · Performance and Core Web Vitals.