SSR vs. CSR vs. SSG
Where and when your page's HTML actually gets generated.
These three rendering strategies answer the same question differently: when does the server produce the HTML a browser first sees? Client-Side Rendering (CSR) ships a near-empty HTML shell and builds the page in the browser with JavaScript. Server-Side Rendering (SSR) generates full HTML per-request on the server. Static Site Generation (SSG) generates HTML once, at build time, for all requests to reuse.
CSR
Best for
- Authenticated, app-like experiences (dashboards) where SEO doesn't matter
- Applications with highly personalized, per-user content that doesn't benefit from server rendering
Trade-offs
- Poor SEO by default — crawlers see an empty shell unless they execute JavaScript
- Slower perceived load — the user sees a blank page until JavaScript downloads and runs
SSR
Best for
- Pages needing SEO with frequently-changing, per-request data
- Personalized content that still needs to be crawlable or fast on first paint
Trade-offs
- Adds server infrastructure and per-request compute cost compared to serving static files
- Slightly higher time-to-first-byte than pre-built static HTML
SSG
Best for
- Content that doesn't change per-request — marketing pages, blogs, documentation
- Maximum performance and the lowest hosting cost (can be served entirely from a CDN)
Trade-offs
- Content updates require a rebuild (or incremental regeneration, where supported) rather than being instantly live
- Not suited to highly dynamic, per-user, or frequently-changing data
| Dimension | CSR | SSR | SSG |
|---|---|---|---|
| When HTML is generated | In the browser, after JS loads | Per request, on the server | Once, at build time |
| SEO | Poor by default | Good | Good |
| Best for | Authenticated apps | Dynamic, crawlable content | Static/rarely-changing content |
Verdict
Modern meta-frameworks (Next.js, Nuxt) let you pick per-route rather than committing your whole app to one strategy — use SSG for marketing/content pages, SSR for dynamic-but-crawlable pages, and CSR for authenticated app interiors where SEO doesn't apply.