next-cache-components

Set cacheComponents: true in next.config.ts to enable Cache Components and Partial Prerendering. This replaces the old experimental.ppr flag and lets routes mix static, cached, and dynamic content.

Place 'use cache' at the top of a file, component, or async function to cache its output. Combine it with cacheLife() to control staleness and cacheTag() to label entries for later invalidation.

Runtime APIs like cookies(), headers(), and searchParams are not allowed inside use cache because cached output must be request-independent. Read the value outside and pass it as an argument, or use 'use cache: private' for compliance cases.

Replace the unstable_cache wrapper with an async function containing 'use cache'. Move options.tags into cacheTag() calls and options.revalidate into cacheLife({ revalidate: N }); manual keyParts arrays are no longer needed since keys derive from arguments and closures.

updateTag invalidates immediately so the same request sees fresh data, while revalidateTag triggers background stale-while-revalidate so the next request gets updated content. Both are called from Server Actions after a mutation.

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