NextjsData Caching

Data Caching

Next.js maintains a server-side Data Cache that stores the results of fetch calls. Unlike an in-memory cache that resets on every request, the Data Cache persists across incoming requests and, by default, across deployments — making it a durable, shared cache for the data your app fetches.

Note
The Data Cache is separate from browser HTTP caching and from React's request-level memoization. It exists on the server, is shared by all users hitting the same deployment, and can survive a redeploy unless you clear it or a fetch call opts out.
How fetch options interact with the Data Cache

Whether a given fetch call is stored in, read from, or skipped by the Data Cache depends entirely on the options you pass to it (or the route segment config it inherits).

TSX
// Stored indefinitely, reused on every future matching request
await fetch(url, { cache: 'force-cache' })

// Never touches the Data Cache — always a fresh network request
await fetch(url, { cache: 'no-store' })

// Stored, but considered stale after 60 seconds and eligible for regeneration
await fetch(url, { next: { revalidate: 60 } })

// Stored and associated with a tag for later on-demand invalidation
await fetch(url, { next: { tags: ['products'] } })

Two fetch calls with identical URL and options are treated as the same cache entry — the second call reuses the first call's stored response rather than hitting the network again, as long as the entry is still considered fresh.

Data Cache vs. Full Route Cache vs. Router Cache

Next.js actually layers several caches on top of each other, and it is easy to conflate them. The Data Cache is only one of the three most relevant to the App Router.

Cache

What it stores

Where it lives

Cleared by

Data Cache

Results of individual fetch() calls

Server

revalidatePath, revalidateTag, cache: "no-store", or the configured revalidate window elapsing

Full Route Cache

The rendered HTML + RSC payload for a whole static route

Server

A new deployment, or revalidation of the underlying data it depends on

Router Cache (client-side)

RSC payloads for routes the user has already visited in this session

Browser (in-memory)

A full page reload, or a set duration passing, depending on route type

The Full Route Cache builds on top of the Data Cache: if every fetch in a route is cacheable, Next.js can cache the entire rendered route, not just the individual data responses. Invalidating the underlying data (via revalidatePath/revalidateTag, or the revalidate window) also invalidates the Full Route Cache for that route.

Opting out per fetch vs. per route

You can control caching at the individual fetch call, as shown above, or for an entire route segment by exporting configuration from a page or layout file — useful when a whole route should never be cached, for example one that always shows account-specific data.

TSX
// Opts this entire route out of the Data Cache and the Full Route Cache
export const dynamic = 'force-dynamic'
Tip
Reach for the route-level config when the whole page should always be dynamic (e.g. anything reading cookies or headers for personalization). Reach for per-fetch options when only some of the data on a page needs different caching behavior than the rest.
Non-fetch data sources aren't automatically cached
Warning
The Data Cache only applies to the fetch API (as extended by Next.js). If you query a database directly with an ORM or SDK, that call is not automatically cached — you would need to wrap it yourself, for example with React's cache() function (covered on the Preloading Data page) or a caching layer of your own.