SSR renders pages on each request, SSG pre-renders at build time, and ISR allows static pages to be updated after deployment.
Next.js provides multiple rendering strategies that can be used on a per-page basis, allowing you to choose the optimal approach for each route.
Server-Side Rendering (SSR) generates HTML on the server for each request. In the App Router, this is the default for dynamic routes. It's ideal when you need fresh data on every request or when content is user-specific. The trade-off is higher server load and slower Time to First Byte (TTFB) compared to static options.
Static Site Generation (SSG) pre-renders pages at build time. The HTML is generated once and reused for every request, served from a CDN for optimal performance. Perfect for content that doesn't change frequently: marketing pages, blog posts, documentation. In the App Router, routes are static by default unless they use dynamic functions.
Incremental Static Regeneration (ISR) combines the benefits of both. Pages are generated statically but can be revalidated after deployment. You set a revalidation period, and Next.js regenerates the page in the background when a request comes in after that period expires. This gives you static performance with relatively fresh data.
In the App Router, you control this with the 'dynamic' and 'revalidate' segment config options, or by using dynamic functions like cookies(), headers(), or searchParams. Understanding these patterns helps you optimize performance while meeting your data freshness requirements.
SSR renders pages on each request, SSG pre-renders at build time, and ISR allows static pages to be updated after deployment.
Join our network of elite AI-native engineers.