fetch() Is No Longer Cached

~22 min · caching, v15, breaking change

Level 0Curious

0 XP0/68 lessons0/11 achievements

0/120 XP to next level120 XP to go0% complete

The biggest behavioral change in v15

In Next.js 14, fetch() in Server Components was cached by default. Developers were burned by stale data they didn't know they had. Next.js 15+ flipped the default: fetch is uncached unless you opt in.

Opt-in caching options

Strategy	How to set it
Cache forever (until revalidate)	`fetch(url, { cache: 'force-cache' })`
ISR — revalidate every N seconds	`fetch(url, { next: { revalidate: 60 } })`
Tag for on-demand invalidation	`fetch(url, { next: { tags: ['posts'] } })`
No cache (default)	`fetch(url)` or explicit `{ cache: 'no-store' }`
Route-level default	`export const revalidate = 60`

What the migration looks like

If your v14 app feels slow after upgrading, find the routes that don't actually need fresh data on every render and add cache: 'force-cache' or next: { revalidate }. Those were getting free caching before; they aren't now.

Code

The change in one screen·tsx

// v14 (gone)
const res = await fetch(url); // cached by default

// v15+ (current)
const res = await fetch(url); // NOT cached — fresh every request

// Opt back in
const cached = await fetch(url, { cache: 'force-cache' });
const isr = await fetch(url, { next: { revalidate: 60 } });
const tagged = await fetch(url, { next: { tags: ['posts'] } });

Route-level revalidate·tsx

// app/blog/page.tsx
export const revalidate = 300; // 5 minutes for the whole route

export default async function BlogPage() {
  // All fetches under this route default to 300s revalidation
  const posts = await fetch('https://api.example.com/posts').then(r => r.json());
  return <PostList posts={posts} />;
}

External links

Exercise

Pick a route that fetches data that changes hourly. Add fetch(url, { next: { revalidate: 3600 } }) and verify with curl that subsequent requests are served from cache for an hour.