Private Cache

1
export const prefetch = 'allow-runtime';
2

3
async function getRecommendations(productId: string) {
4
  'use cache: private';
5
  cacheTag(`recommendations-${productId}`);
6
  cacheLife({ stale: 60 });
7

8
  // Can call cookies() INSIDE the cached function!
9
  const sessionId = (await cookies()).get('session-id')?.value || 'guest';
10

11
  return getPersonalizedRecommendations(productId, sessionId);
12
}

Demo

• Products labeled "Private Cache" link to pages that use use cache: private to enable runtime prefetching. The content is still dynamic, but it's prefetched when the static content of the page is also prefetched.
• Products labeled "No Private Cache" link to pages that don't use use cache: private, meaning their recommendations will be loaded after navigation.
• For demo purposes, the links display visual loading states:
  • Pink border with "Prefetching Private Cache..." when the runtime prefetch is in progress
  • Blue border with "Prefetched Private Cache" when the runtime prefetch has completed
  • Gray border for links without private cache
• With Private Cache: Personalized recommendations appear instantly (runtime prefetched).
• Without Private Cache: Recommendations show a loading skeleton, then appear after they're finished loading. The loading starts when the link is clicked.
• Click "Change Session" to get different personalized recommendations - notice how Private Cache links still runtime prefetch your new session's data.

Notes

• This demo uses the use cache directive. use cache: private is currently experimental.