What makes a route dynamic in the Next.js App Router?

Q: What makes a route dynamic in the Next.js App Router?

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity. **Difficulty:** Medium > **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the **Verified** section, against real output from a build or a running server; each Verified block names the version it ran on. ## 1. Why This Even Matters — A Story First Picture a print shop that prepares posters ahead of time. The moment an order says "put the customer name on it" or "use today's weather", it can no longer be printed in advance; it has to be printed when the customer arrives. And if the frame the poster goes into (the layout) needs the customer name, every poster in that frame waits, even the ones that never mention a name. ## 2. The Core Idea 📌 **Interview term: Dy

The problem

Question presented to candidate: "A marketing page that should be static shows up as dynamic in the build output. How do you find out why, and what are the things that make a route dynamic?"

What a strong answer should cover:

A route is dynamic when rendering it needs information that only exists at request time.
Request-time APIs: cookies(), headers(), searchParams, connection(), draftMode(); plus fetch with cache: 'no-store' or revalidate: 0.
export const dynamic = 'force-dynamic' forces it explicitly.
A dynamic layout makes every page under it dynamic, even pages that read nothing.
The build table (ƒ) and a private, no-store cache-control header show the result; with Cache Components the build instead demands a Suspense boundary.

Clarifying questions expected:

"Which layouts wrap this page?" — the cause is often in a shared layout.
"Does the page need that request data for its first paint?" — if not, move it into Suspense.

Code / implementation expected: Yes — the triggers, and moving one into a Suspense boundary.

nextjs
dynamic-rendering
cookies
headers

Try it yourself

Sketch your approach before you read the solution. That is what the interview tests.

Stuck? Get a hint.

A short nudge toward the approach. It will not give the answer away.

Solution

Target Audience: Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity. Difficulty: Medium

How to read this doc: Each idea is explained in plain language first, then tagged with 📌 Interview term:. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the Verified section, against real output from a build or a running server; each Verified block names the version it ran on.

1. Why This Even Matters — A Story First

Picture a print shop that prepares posters ahead of time. The moment an order says "put the customer name on it" or "use today's weather", it can no longer be printed in advance; it has to be printed when the customer arrives. And if the frame the poster goes into (the layout) needs the customer name, every poster in that

The solution is hidden so you can try first

4 min read · 8 sections

Read the code

Keeping the page static by isolating the request read

// Before: the whole route is dynamic because the page reads cookies.
// After:
import { Suspense } from "react";
import { cookies } from "next/headers";

async function CartCount() {
  const count = (await cookies()).get("cart")?.value ?? "0";
  return <span>Cart ({count})</span>;
}

export default function Page() {
  return (
    <main>
      <h1>Summer sale</h1>                           {/* no request data */}
      <Suspense fallback={<span>Cart</span>}>
        <CartCount />                                 {/* only this part needs the request */}
      </Suspense>
    </main>
  );
}

Discussion

Other approaches, follow-ups and how it went in real interviews.

Sign in to join the discussion.

No comments yet. Share how you would answer it.

The solution is hidden so you can try first

Keep your momentum going.