Caching Edge Function Responses
Learn how Edge Function responses are cached with Vercel and how you can define the cache behavior with this guide.The Vercel Edge Network cache is active for all deployments and domains on your account and caches your content at the edge to serve data to your users as fast as possible.
The Vercel Edge Network is available for all of our pricing plans (including the Hobby plan) and can be activated for Edge Functions (including SSR) by providing Cache-Control
headers.
If Cache-Control
headers are provided, responses will be cached in the region it's requested from.
In order for responses to be cached with the Cache-Control
header by the Vercel Edge Network cache for the requested path, the following criteria must be met:
- Request must use
GET
orHEAD
method - Request must not contain the
Range
header - Request must not contain the
Authorization
header - Request must not contain a
_vercel_no_cache=1
cookie - Request must not contain a
?_vercel_no_cache=1
request parameter - Response must use
200
,404
,301
, or308
status code - Response must not exceed
10MB
in content length - Response must not contain the
set-cookie
header - Response must not contain the
private
,no-cache
orno-store
directives in theCache-Control
header
To control how responses are cached, you can provide a Cache-Control
header in the response from your Edge Function. It can include any of the following directives, separated by a comma:
s-maxage=N
max-age=N, public
max-age=N, immutable
N
is the number of seconds the response should be cached for.As an example, you can set the Cache-Control
header in your Edge API Routes by using the Response
object:
Cache-Control
headers cannot be set using next.config.js
or vercel.json
(for other frameworks) files.We recommend that you set your cache to have max-age=0, s-maxage=86400
, with changing 86400
to the amount of seconds you want your response to be cached for.
This recommendation will tell browsers not to cache and let our edge cache the responses and invalidate when your deployments update, so you never have to worry about stale content.
The Vercel Edge Network cache supports a powerful recent extension to the Cache-Control
header called stale-while-revalidate
.
The benefit of using stale-while-revalidate
is that we can serve a resource from our CDN cache while simultaneously updating the cache in the background with the response from your function.
Some situations where stale-while-revalidate
is of great value:
- Your content changes frequently but it takes a significant amount of time to regenerate. For example, an expensive database query or upstream API request
- Your content changes infrequently but you want to have the flexibility to update it (to fix a typo, for example) and don't wait for cache to expire
In both cases, we recommend using:
Cache-Control: s-maxage=1, stale-while-revalidate
Which tells our CDN: serve from cache, but update it, if requested after 1 second.
When the CDN receives a request with Pragma: no-cache
(such as when the browser devtools are open), it will revalidate any stale resource synchronously, instead of in the background.
Using the private
directive specifies that the response can only be cached by the client and will not be cached by the Vercel Edge Network.
Every time you deploy with a custom domain, the cache for that domain is purged. This means that users will never see content from a previous deployment on your custom domain and there is no need to invalidate it manually when deploying.
Was this helpful?