cache-components

Expert guidance for Next.js Cache Components and Partial Prerendering (PPR).

PROACTIVE ACTIVATION: Use this skill automatically when working in Next.js projects that have cacheComponents: true in their next.config.ts or next.config.js.

DETECTION: At the start of a session in a Next.js project, check for cacheComponents: true in next.config. If enabled, this skill's patterns should guide all component authoring, data fetching, and caching decisions.

USE CASES:

• Implementing 'use cache' directive
• Configuring cache lifetimes with cacheLife()
• Tagging cached data with cacheTag()
• Invalidating caches with updateTag() / revalidateTag()
• Optimizing static vs dynamic content boundaries
• Debugging cache issues
• Reviewing Cache Component implementations

Project Detection

When starting work in a Next.js project, check if Cache Components are enabled: