Development Skill
Angular Migration
Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and…
$15
Next Cache Components
Next.js 16 Cache Components: PPR, use cache directive, cacheLife, cacheTag, updateTag
A practical guide to Next.js 16 Cache Components and Partial Prerendering, where static shell, cached data, and dynamic content can all live in one route. It covers the use-cache directive, cacheLife profiles, cacheTag, and the critical difference between updateTag for same-request freshness and revalidateTag for background revalidation, so you serve fast pages without showing stale data after a user action.
$15 one-time
Add to a kit → Prices include 20% VAT. · Forged on real agency work · one-time, no lock-in
- Type Skill
- Category Development
- Delivery Email · instant
- License One-time
Inside the run · no black box
See the actual work before you buy it.
Who does this data belong to? Every component in a Next.js 16 codebase answers that question once, and the static, cached or dynamic classification follows from the answer.
- Flips cacheComponents: true in next.config.ts, which replaces the old experimental.ppr flag and turns on Partial Prerendering at the component level.
- Classifies every component into the static/cached/dynamic triple by asking 'who does this data belong to': synchronous shell is auto-prerendered, shared async data gets 'use cache', user-specific data stays dynamic behind a Suspense boundary.
- Marks cached functions with the full trio: 'use cache' on the function, cacheLife (a built-in profile like 'hours' or an inline stale/revalidate/expire config) for lifetime, cacheTag for targeted invalidation. Cache keys derive automatically from arguments and closures, no manual key arrays.
- Moves runtime APIs out of cached scopes: cookies(), headers() and searchParams are forbidden inside 'use cache', so they are resolved outside and passed in as arguments, which makes them part of the cache key for free.
- Picks the invalidation strategy per action: updateTag when the user must see fresh data in the same request (form submits), revalidateTag for stale-while-revalidate background refresh. Mixing them up is the classic 'I saved but still see old data' bug.
- Migrates legacy unstable_cache calls: drops the manual keyParts array, replaces options.tags with cacheTag() and options.revalidate with cacheLife(), then checks the limitations list (no Edge runtime, no static export, non-deterministic values freeze at build time).
One power source. 6 lines out.
next-cache-components · core
core active · 6 lines
- ✓ mixing static shell, cac…
Mixing static shell, cached, and dynamic content in one route
- ✓ caching infrequently cha…
Caching infrequently changing data with stale-while-revalidate
- ✓ tagging cached content for
Tagging cached content for precise invalidation
- ✓ refreshing the cache ins…
Refreshing the cache instantly after a server-action update
- ✓ migrating from unstable_…
Migrating from unstable_cache to the use-cache directive
- ✓ streaming user-specific…
Streaming user-specific content behind a Suspense boundary
Yours to keep.
Drag time forward. Watch what stays.
Forever
That's what owning means.
The rented stack
ai writing tool: subscription
expired · access lostanalytics suite: subscription
expired · access lostdesign platform: subscription
expired · access lost(nothing left)
Your forge
-
Serve a static-fast first byte while dynamic content streams in
license: perpetual -
Cut redundant database calls with automatic cache keys
license: perpetual -
Show fresh data right after a user action with immediate invalidation
license: perpetual -
Replace manual cache keys and avoid cache-poisoning mistakes
license: perpetual
subscriptions expire · deeds don't
Everything in the box.
Pick a piece up. Watch it work.
Cache Components and PPR enablement config
6 parts · one working system · ships instantly by email
This wasn't forged for everyone.
- Not for you if you'd rather rent a tool than own one.
- Not for you if you want someone else to run your stack.
- Not for you if you're happy guessing.
For Next.js 16 developers who want fast, correctly cached pages with precise invalidation and no stale-data surprises after user actions.
then this was forged for you.Works with
Universal by design: these run in any AI. Delivered in the open Agent Skills + MCP format (native in Claude); ChatGPT, Gemini, Cursor and Copilot adapt the same files their own way.
- Claude Native format
- ChatGPT Adapts via open standards
- Gemini Adapts via open standards
- Cursor Adapts via open standards
- Copilot Adapts via open standards
Catch what's on your mind.
the air is clear. nothing between you and the forge.
catch a spark: the forge will answer
-
I'm on Next.js 14 or 15. Can I use any of this today?
The directives themselves need Next.js 16, since Cache Components and PPR ship there. What you can use now is the migration table from experimental.ppr and unstable_cache, which tells you how your current setup maps onto the new model so the upgrade lands prepared.
-
updateTag and revalidateTag sound identical. What's the real difference?
updateTag refreshes within the same request, so the user who just submitted a server action sees their change immediately. revalidateTag schedules background revalidation, meaning the next visitor gets fresh data. Pick wrong and you either show stale data after an action or pay for needless synchronous work; the decision guide maps which to use where.
-
Can I cache user-specific content with this too?
No, and you shouldn't try. Personalized content is classified as dynamic and streams behind a Suspense boundary; putting it under use-cache would serve one user's data to another. The content-type breakdown exists precisely to keep static, cached, and per-user content in their right lanes.
-
How is it delivered?
By email right after purchase: ready to run, downloaded instantly, no setup wait.
-
One-time or subscription?
A one-time purchase; no subscription or hidden fees. VAT (20%) is included.
-
Can I get a refund?
As a digital product, it can’t be refunded once downloaded. That’s why we show exactly what’s inside and who it’s for, right here.