Rendering strategies on a timeline

Requests, responses, paints and hydration flow across browser, network and server lanes, and TTFB, FCP, LCP and TTI land on the same time axis. Change a parameter and the markers move immediately.

CSR Client-Side Rendering
Empty HTML plus a heavy JS bundle. Slow first load and weak SEO, but smooth navigation afterwards and the lowest server cost.
Fits: Admin dashboards, B2B SaaS, web office apps
SSR Server-Side Rendering
The server builds complete HTML on every request. Strong FCP and SEO, but watch TTFB, server cost and the pre-hydration dead zone.
Fits: Personalized feeds, real-time commerce product and search pages
SSG Static Site Generation
HTML is built at deploy time and cached on a CDN. Best TTFB and FCP, but any data change needs a rebuild.
Fits: Tech blogs, marketing landing pages, documentation
ISR Incremental Static Regeneration
SSG speed plus background regeneration (revalidate). The standard way to make large dynamic catalogs static.
Fits: Large commerce catalogs, news articles
Streaming Streaming SSR + RSC
Stream the shell first, then chunks as they resolve, and hydrate each section selectively. Fixes TTFB and TTI bottlenecks at once.
Fits: Complex dashboards, large modern web services