Full Route Cache vs Data Cache and per-fetch cache control
Tests App Router's dual caching layers. Full Route Cache stores rendered HTML and RSC payload at build time; Data Cache stores raw fetch results across routes. Control a fetch with cache and next.revalidate options.
What's really being asked
This question tests whether you understand the App Router's caching architecture beyond surface-level definitions. Interviewers want to see that you know there are two distinct caches with different scopes, lifetimes, and invalidation mechanisms, and that you can surgically control data fetching without throwing away the entire route cache.
The full answer
Four things in order. First, define Full Route Cache as a build-time or revalidated cache of the rendered HTML and React Server Component payload for an entire route segment. Second, define Data Cache as a persistent cache of raw fetch responses that is shared across routes and requests, deduplicated by URL. Third, explain that Full Route Cache depends on Data Cache: if the data cache entries are fresh, the route can be served statically from the Full Route Cache. Fourth, explain that you control a specific fetch by passing options directly to the fetch call, specifically the cache property set to force-cache or no-store, and the next.revalidate property set to a number of seconds or false.
The mistakes people make
Three red flags stand out. One, conflating the two caches by saying there is just one cache in App Router. Two, suggesting that route segment config like export const dynamic controls a single fetch rather than the entire route's rendering behavior. Three, mentioning useEffect or client-side data fetching as the way to control cache for a Server Component fetch, which reveals confusion about where the fetch runs.
What usually comes next
The interviewer may ask how revalidatePath or revalidateTag invalidates these caches, or how unstable_noStore opts an entire component out of static rendering. They might also ask what happens when you set cache no-store on one fetch but leave another cached in the same component, or how the Data Cache behaves during static generation versus dynamic rendering.
A concrete example
Imagine a blog page that fetches a trending posts list and a user-specific avatar. You would write the trending fetch as fetch(url, { cache: force-cache, next: { revalidate: 60 } }) so it populates both Data Cache and Full Route Cache. You would write the avatar fetch as fetch(url, { cache: no-store }) to bypass Data Cache for that request. The route itself might still be statically rendered for the trending section while dynamically streaming the avatar.
Interview question
In a Next.js App Router Server Component, how can you make one specific fetch request bypass the Data Cache while allowing the route to remain statically rendered?
- a.Pass cache: no-store directly to that specific fetch callCorrect
- b.Call revalidatePath after the fetch to invalidate the entry
- c.Add export const dynamic = force-dynamic to the page file
- d.Fetch the data inside a useEffect hook on the client
Why? this is the answer
You control a specific fetch by passing the cache option directly to the fetch call with a value of no-store, which bypasses the Data Cache for that request while leaving the route capable of static rendering. Using export const dynamic controls the entire route rendering behavior, not an individual fetch.
Just read this? Test yourself on what you have been reading.
Read the original → nextjs.org
Put your scrolling time to good use
Learn one idea, try a quiz and save useful cards for revision. Tezvyn makes it easy to learn and stay current in your tech field, a few minutes at a time.
The iPhone app is on the way
We are building it. Until it lands, nothing here is held back from you: every interview card, your saved cards, streaks and the job board all work in Safari, plus hundreds of free practice quizzes of thirty questions each. Sign in and it all carries over to the app the day it arrives.
Want it as an icon? Tap Share at the bottom of Safari, then Add to Home Screen. It opens full screen and the cards you have read stay available offline.
We are hiring for this. Open roles that interview on next.js — each one lists the topics its interview covers.
See open roles