How SSR works in each router
Pages Router
A page opts into SSR by exporting an async function named getServerSideProps. It runs on every request, while getStaticProps runs at build time. Only page files can export it. The props it returns are embedded in the initial HTML so the page can hydrate, so they must not contain secrets. On client-side navigation with next/link or next/router, Next.js sends a request to the server, which runs getServerSideProps again. The Next.js SSR docs cover the full API.
App Router
The App Router has no getServerSideProps. A component is rendered at request time when it uses Request-time APIs. These APIs, such as cookies(), headers(), searchParams and draftMode(), read request-specific data. Without Cache Components (the previous model), export const dynamic = 'force-dynamic' renders a route for each user at request time.
When to use SSR, and what changed in Next.js 16
The docs recommend getServerSideProps for pages that rely on personalized user data or on information only known at request time. Two options shape the response:
404 handling. Returning
notFound: truesends a 404 status and the 404 page.CDN caching. Setting
Cache-Controlheaders inside the function makes the SSR response cacheable by a CDN.
Current Next.js docs place the boundary between static and dynamic rendering at the component level rather than the route level. With Cache Components enabled (Next.js 16), reading cookies() inside a Suspense boundary no longer makes the whole route dynamic, as it did in the previous model. As of Next.js 16.4, create-next-app enables Cache Components by default in new apps. Where that per-component line falls is a design decision in App Router Next.js development.
getServerSideProps arrived in Next.js 9.3.0. For how SSR compares with the other modes, see Next.js rendering strategies and SSR vs CSR.
Sources
- Server-side Rendering (SSR) - Pages RouterNext.js · nextjs.org
- GlossaryNext.js · nextjs.org
- Static Site Generation (SSG) - Pages RouterNext.js · nextjs.org
- getServerSideProps - Data Fetching (Pages Router)Next.js · nextjs.org
- Caching (Previous Model)Next.js · nextjs.org
- getServerSideProps - API Reference (Pages Router)Next.js · nextjs.org
- Next.js Rendering PhilosophyNext.js · nextjs.org
- Caching (Cache Components)Next.js · nextjs.org
- Next.js 16.4Next.js · nextjs.org