How Next.js Edge Caching Causes Stale Pages and How to Fix It

Next.js uses aggressive edge caching for statically prerendered pages, setting a Cache-Control s-maxage of one year, which can cause listing pages to appear outdated even after content updates. A developer noticed this when their article listing page failed to reflect new posts, while individual article pages updated normally due to dynamic rendering or revalidation settings. The root cause is not a bug but intended Next.js App Router behavior, where shared cache headers override browser-level cache controls. Developers can address this by adding a revalidate export to the page file, which triggers background regeneration at a set interval after the cache expires. For immediate updates, Next.js also offers on-demand revalidation via the revalidatePath function, which can be called from a CMS webhook or API route to instantly invalidate a cached page.