Introduction

Vercel caches the information directly at their edge technology to serve data to users as fast as possible and with no configuration required.

Different ways:

Cache-control header filed: you may include this property at the header object and it will define the behavior of the cache according to the requirements. To use it a certain criteria should be followed:

• GET or HEAD method
• NO RANGE property inside the header
• NO AUTHORIZATION property inside the header
• NO _vercel_no_cache=1 cookie
• NO ?_vercel_no_cache_1 request paramenter
• Response with status code equal to = 200, 404, 301, 308
• Response with a content length inferior to 10MB
• Response without no-cache directive in the Cache-Control header

VERCEL DOES NOT ALOW BYPASSING THE CACHE FOR STATIC FILES

Static Files Caching

Automatically caches at edge after the first request and up to 31 days. If a file doesn’t change, it will be persisted across deployments as their has caches static files. If you re-deploy it will reset the cache.

Using NEXT.js image optimization will also persist between deployments.

Cache-Control header will return public, max-age=0 and must-revalidate so browsers don’t cache the file locally.

Stale-While-Revalidate

Vercel’s Edge Network extension, which allows to serve content from the Edge cache while updating the cache in the background at the same time.

Situations where Stale-While-Revalidate is great: