Next.js 13+ App Router caching confuses many developers. Interviewers expect you to name the cache layers and how to opt out or revalidate.
Common Interview Questions
Q: Name the caching mechanisms
Answer: Request memoization (per-request dedup), Data Cache (fetch results across requests), Full Route Cache (static HTML/RSC payload), and Client Router Cache (soft navigation).
Q: Opt out of Data Cache?
Answer: no-store skips caching for that fetch. Route segment config dynamic forces dynamic rendering for the whole route.
fetch(url, { cache: "no-store" });
// or
export const dynamic = "force-dynamic";
Q: revalidateTag vs revalidatePath?
Answer: revalidateTag invalidates tagged fetch cache entries. revalidatePath invalidates a specific path in Full Route Cache.
import { revalidateTag } from "next/cache";
revalidateTag("posts");
Q: Router cache behavior?
Answer: Client-side soft navigation caches RSC payload for ~30s (static) or back/forward. Hard refresh bypasses. Mention stale-while-revalidate UX.
Key Points for Interviews
-
Default fetch in Server Components is cached
-
Static routes benefit from Full Route Cache
-
Tag-based revalidation for CMS webhooks
-
Understand static vs dynamic rendering decision
-
Debugging: log fetch cache mode in development