The Router Cache
In-memory client caching for instant SPA navigation.
The browser's memory
The Router Cache is unique because it is the only cache in the Next.js ecosystem that lives entirely in the user's browser (client-side).
As a user navigates your application, Next.js stores the React Server Component (RSC) payload of every visited route segment directly in the browser's memory.
Instant back/forward navigation
This cache is what gives the App Router its lightning-fast, Single Page Application (SPA) feel.
If a user visits the /about page, clicks a link to /contact, and then clicks the browser's 'Back' button, Next.js does not need to contact the server. It instantly restores the /about page directly from the Router Cache.
How it invalidates
Because the Router Cache lives in the browser's memory, it is completely destroyed the moment the user hits 'Refresh' (F5) or closes the tab.
While the tab remains open, Next.js uses a staleTime heuristic to decide how long to keep the data. By default in Next.js 15, statically generated routes remain in the Router Cache for 5 minutes.
The Browser Memory
Click around the simulated browser. Notice how navigating to a new page triggers a slow network request to the Next.js Server. However, if you navigate to a page you've already visited, it restores instantly from the Router Cache.
User's Browser
Home
Origin
Check yourself
Pick an answer to lock it in, then read why. Getting one wrong is part of how it sticks.
Remember this
- The Router Cache lives entirely in the user's browser memory.
- It enables instant back/forward navigation.
- It is completely wiped if the user hard-refreshes the page.
- Next.js 15 defaults to 0 seconds for dynamic routes, but 5 minutes for static routes.
- Use
router.refresh()to manually trigger a fresh fetch from the client.
Done with this concept?
Mark it complete to track your progress. No login needed.