Top 20 Next.js Interview Questions, Actually Explained

The capstone of the why-Next.js series — condensed, with each answer pointing back to the post that covers the full mechanism.

Rendering strategy

• What's the difference between SSR, SSG, and ISR? — SSG generates HTML once at build time (fastest, for content that doesn't change per request); SSR generates it fresh on every request (for genuinely per-user or per-request content); ISR is SSG with a revalidation window, regenerating in the background after N seconds. Full framework with a decision process in the SSR/SSG/ISR/CSR post.
• Why would a page need SSR instead of just being static? — When its content genuinely differs per request or per logged-in user, and can't be known at build time — a personalized dashboard, not a blog post.
• How does Next.js decide whether a page is static or dynamic? — By what APIs the page actually uses: reading cookies, headers, or search params inside a Server Component forces that route into dynamic rendering; a page with none of those gets statically generated by default.

The App Router

• What does a layout.tsx actually do that a shared component wouldn't? — It nests automatically for every route beneath it, AND its React state survives client-side navigation between routes that share it — a shared component re-imported per page would remount and lose that state on every navigation.
• What's the difference between loading.tsx and a manual isLoading state? — loading.tsx wires up a real React Suspense boundary automatically, at the route level, coordinated with the router's own navigation — not a manually-managed boolean a developer has to remember to set and unset correctly.
• Are Server Components the default in the App Router? — Yes; a component only becomes a Client Component when 'use client' is added at the top of its file, and that boundary doesn't propagate to its own children automatically.

Practical / performance

• Why use next/image instead of a plain <img>? — Automatic correct sizing for rendered dimensions, modern format conversion, lazy loading by default, and reserved layout space via required width/height — directly targeting LCP and CLS, not just file size.
• When would you use a Next.js API route instead of a separate backend? — When the endpoint's needs (a contact form, a webhook, a thin API proxy) don't require a genuinely separate deploy lifecycle or long-running processes — full framework in the API routes post.
• Why did the ecosystem move away from Create React App? — CRA solved build tooling only, with zero opinion on routing, rendering strategy, or SEO — gaps that stayed unsolved and got expensive to retrofit later, once an app had already grown around CRA's assumptions.