Rendering Modes Overview

Next chooses Static or Dynamic at build time based on what each route does. You can force the mode you want with route segment config.

4 min read Level 2/5 #nextjs#rendering#ssg

What you'll learn

Recognize when a route renders statically vs dynamically
Know that `fetch()` options and APIs like `cookies()` decide the mode
Use `export const dynamic` to force a mode

Next.js does not ask you to pick SSR or SSG up front. It looks at what each route does and picks the right mode automatically — and you can override that choice when you need to.

What Makes a Route Dynamic

A route becomes dynamic the moment it reads request-specific data:

cookies() or headers() from next/headers
a dynamic searchParams prop in a page
fetch(url, { cache: 'no-store' })
export const dynamic = 'force-dynamic'

If none of those happen, the route is static and gets prerendered at build time.

Forcing a Mode

// app/dashboard/page.tsx — always dynamic
export const dynamic = 'force-dynamic'

export default async function Page() {
  return <h1>Live data</h1>
}

// app/about/page.tsx — always static, even if you accidentally read cookies()
export const dynamic = 'force-static'

Partial Prerendering

Next 15 introduces Partial Prerendering: a single route can mix a static shell with dynamic islands wrapped in <Suspense>. The static part flushes instantly while the dynamic parts stream in. You get SSG speed without sacrificing freshness — the next few lessons cover each piece.

Static Generation →