Q37: How do you configure Client Router Cache staleTimes in Next.js?
The Client Router Cache stores rendered RSC payloads in browser memory. By default, dynamic routes stay fresh for 0 seconds and static routes stay fresh for 5 minutes. You can customize cache durations using staleTimes inside next.config.js.
Configuring Router Cache Stale Times
// next.config.mjs
export default {
experimental: {
staleTimes: {
dynamic: 30, // Keep dynamic pages fresh in browser memory for 30s
static: 180, // Keep static pages fresh for 3 minutes
},
},
};💡 staleTimes adjusts client router cache retention in browser memory.
Key Takeaways
- Controls browser memory cache durations for client routing.
- Configured via
experimental.staleTimes.dynamicinnext.config.js.
Knowledge Check
What is the default client Router Cache stale duration for dynamic routes in Next.js App Router?