next-cache-components

Set cacheComponents: true in next.config.ts to enable Cache Components, which replaces the old experimental.ppr flag. Once enabled, routes can mix static prerendered content, cached components, and dynamic Suspense boundaries.

Add 'use cache' at the top of a file, component, or async function to cache its output. Control lifetime with cacheLife() using built-in profiles like 'hours' or inline stale, revalidate, and expire values, and tag entries with cacheTag() for invalidation.

Replace the unstable_cache wrapper with an async function containing 'use cache', move options.tags into cacheTag() calls, and convert options.revalidate into cacheLife({ revalidate: N }). Manual keyParts arrays are no longer needed because cache keys derive automatically from arguments and closures.

Runtime APIs like cookies(), headers(), and searchParams are forbidden inside use cache because cached output cannot depend on per-request data. Extract the value outside the cached function and pass it as an argument, or use 'use cache: private' for compliance cases.

updateTag invalidates a cache tag immediately so the same request sees fresh data, while revalidateTag triggers background revalidation with stale-while-revalidate behavior. Use updateTag after mutations that must be visible instantly, such as updating a product record.

Cache Components require the Node.js runtime and do not support Edge runtime or static export. Non-deterministic values like Math.random() and Date.now() execute once at build time inside use cache, so request-time randomness needs connection() from next/server.