Implement Next.js App Router caching with the 'use cache' directive.
npx skills add https://github.com/perimetre/ai-toolkit --skill caching-perimetre
Please help me install this Agent Skill. Skill: caching Source: https://github.com/perimetre/ai-toolkit/tree/main/plugins/perimetre-apps/skills/caching Command: npx skills add https://github.com/perimetre/ai-toolkit --skill caching-perimetre
This Skill guides developers to implement modern caching strategies in Next.js App Router to maximize performance, reduce server load, and ensure fresh content.
Set up a Next.js route that caches data with a colocated function using "use cache" and configure revalidate and tags to enable automatic background updates.
High-intent search queries and answers about installing and using this skill.
Next.js App Router caching is implemented using the 'use cache' directive for server components and functions. This approach applies time-based revalidation and tag-based invalidation across data-fetching, server components, and API routes to optimize performance.
Use cacheLife and cacheTag in Next.js 16+ when you need fine-grained control over cached data lifecycles and on-demand invalidation. cacheLife manages time-based revalidation, while cacheTag enables targeted invalidation across pages and APIs.
Yes, the 'use cache' directive supports colocated caching patterns in Next.js 16+. You can set up routes that cache data with colocated functions, configuring revalidate and tags to enable automatic background updates for SSG and ISR.
Combining SSG and ISR in Next.js involves using route-level revalidation alongside the 'use cache' directive. This strategy achieves fast initial loads with up-to-date content across dynamic routes by applying cacheLife and revalidateTag APIs.
Tag-based invalidation requires revalidateTag to manually purge cached data associated with specific cacheTag identifiers. This ensures that when underlying data changes, the cached server component or API route responses are accurately updated across the application.
remiconnessonConfigure Next.js Cache Components for static, cached, and dynamic rendering.
sgcarstrendsCreate or update Next.js server actions with Zod validation and cache revalidation.
alexdcdEnforce React and Next.js performance best practices in code reviews and refactors.
netlifyConfigure and validate Netlify CDN and browser caching headers.
