{"enrichment":{"faq":[{"a":"nextjs-cache-architecture teaches you to structure caching from the start by placing \"use cache\" directives on data-fetching functions rather than pages. Build a tag registry to organize cache keys, create revalidation utilities wired to mutations, and use Suspense boundaries for partial prerendering. The skill provides templates for tags, revalidation handlers, and patterns to keep cache logic centralized and maintainable across your App Router project.","q":"How do I set up caching in Next.js App Router?"},{"a":"nextjs-cache-architecture emphasizes wiring mutations directly to invalidation by setting up revalidation utilities that respond to data changes. Rather than manual cache busting, you define which tags each mutation affects, then use those tags to revalidate affected cached data. The skill includes setup patterns for cache tag registries and handlers so invalidation stays predictable and tied to your data model.","q":"What is the nextjs-cache-architecture skill's approach to cache invalidation?"},{"a":"nextjs-cache-architecture addresses this by teaching you to place cache boundaries strategically\u2014personalized content should live outside cached functions or use user-specific cache tags. The skill shows patterns for wrapping user-dependent logic in Suspense boundaries and organizing data fetches so that shared, cacheable content stays separate from per-user variations, enabling partial prerendering without stale personalization.","q":"How do I handle personalized or user-specific content with cache boundaries?"},{"a":"nextjs-cache-architecture covers migration by showing how the \"use cache\" directive replaces unstable_cache with a cleaner, directive-based approach. The skill walks through converting existing unstable_cache calls to \"use cache\" functions, updating tag strategies, and rewiring revalidation logic. This prepares your codebase for Next.js 16+ while preserving your cache architecture's intent.","q":"How do I migrate from unstable_cache to the new use cache directive?"},{"a":"nextjs-cache-architecture provides troubleshooting patterns for stale data by helping you trace cache tag assignments, verify revalidation is firing on mutations, and check Suspense boundary placement. The skill teaches you to log tag registries, inspect which mutations trigger which invalidations, and validate that cache keys derive correctly from your data model, making it easier to spot why cached content isn't refreshing as expected.","q":"How do I debug stale or incorrectly fresh cached data in Next.js?"},{"a":"nextjs-cache-architecture recommends building a centralized tag registry and revalidation utilities from the start, organizing cache logic on data functions rather than pages, and using Suspense boundaries for partial prerendering. For large projects, the skill emphasizes separating cacheable shared content from personalized content, wiring mutations to specific tags, and structuring your App Router so cache decisions stay consistent and auditable across teams.","q":"What caching strategy does nextjs-cache-architecture recommend for large projects?"}],"shadow_tags":["cache-invalidation-strategy","server-side-caching","tag-based-revalidation","partial-prerendering","cache-key-generation","mutation-driven-refresh","suspense-orchestration","personalization-patterns","cache-lifecycle-management","stale-while-revalidate"],"summary_rewrite":"Structure caching from the start in Next.js 16+ App Router projects by building a tag registry, revalidation utilities, and data-fetching functions with \"use cache\" directives. This skill guides you through placing cache logic on data functions rather than pages, wiring mutations to invalidation, and organizing Suspense boundaries for partial prerendering. Includes templates for tags, revalidation handlers, and patterns for personalized content near cache boundaries."},"files":[{"bytes":13264,"path":"skills/nextjs-cache-architecture/SKILL.md","sha256":"f324b456a36c80096d9ea8be4a397612a2ea5111c0d41dac743c724bf3fa37d8","url":"https://skillfed.io/files/mohamed-hossam1/nextjs-skills/nextjs-cache-architecture/5ff047e8/SKILL.md"}],"id":"mohamed-hossam1/nextjs-skills/nextjs-cache-architecture","links":{"html":"https://skillfed.io/mohamed-hossam1/nextjs-skills/nextjs-cache-architecture","md":"https://skillfed.io/mohamed-hossam1/nextjs-skills/nextjs-cache-architecture.md","repo":"https://github.com/mohamed-hossam1/nextjs-skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":0,"language":"JavaScript","last_updated":"2026-05-30","license":"MIT","name":"nextjs-cache-architecture","publisher":"mohamed-hossam1","stars":8},"relations":{"similar":[{"id":"vercel-labs/openreview/next-cache-components"},{"id":"sanity-io/next-sanity/next-cache-components"},{"id":"charlietlamb/openlogs/next-cache-components"},{"id":"sangrokjung/claude-forge/cache-components"},{"id":"laguagu/claude-code-nextjs-skills/cache-components"},{"id":"joelhooks/joelclaw/nextjs-static-shells"},{"id":"laguagu/claude-code-nextjs-skills/nextjs-shadcn"},{"id":"yonatangross/orchestkit/react-server-components-framework"},{"id":"pproenca/dot-skills/nextjs-ppr-patterns"},{"id":"horuz-ai/claude-plugins/nextjs-16-architecture"}]},"slug":{"owner":"mohamed-hossam1","repo":"nextjs-skills","skill":"nextjs-cache-architecture"},"version":"5ff047e8"}