CDN
Also called: content delivery network, edge cache, edge network.
A network of servers around the world that keeps cached copies of your files and responses close to users. Each request goes to a nearby edge server, and only a miss travels on to your own server (the origin). Cache-Control headers decide what it caches and for how long.
Users in Tokyo open a page with an image, one after another. The first one misses: the Tokyo edge fetches the image from the origin in Virginia. Everyone after that gets the edge's copy.
Edge hits: 0 · Trips to the origin: 0
Nothing loaded yet. The edge server in Tokyo has no copy of the image.
Say it in a prompt
Serve /assets/* through a CDN: put a content hash in every file name (app.3f9a1c.js) and send Cache-Control: public, max-age=31536000, immutable. For HTML pages send Cache-Control: public, max-age=0, s-maxage=60, stale-while-revalidate=300, and purge the HTML paths on every deploy. Vague vs precise prompt
Vague prompt
the site is slow for users in Asia, fix it Typical resultCompresses the images and minifies the JavaScript, but every request still crosses the ocean to one server in Virginia.
Precise prompt
Put /assets/* behind a CDN with hashed file names and Cache-Control: public, max-age=31536000, immutable. Give HTML Cache-Control: public, max-age=0, s-maxage=60, stale-while-revalidate=300, and purge the HTML paths on deploy. Typical resultScripts, styles and images come from an edge server near each user. Browsers ask the edge again for HTML; the edge refreshes its copy in the background after a minute and drops it on every deploy. The origin sees far fewer requests.
Seen on
- Cloudflare: Caches static files such as images, CSS and JavaScript by default, but not HTML or JSON, and follows the Cache-Control headers from your origin.
- Amazon CloudFront: Routes each request to the edge location with the lowest latency; if the file isn't cached there, it fetches it from your origin.
You might describe it as
- put the images on servers closer to the users
- the site loads slowly for people in other countries
- serve static files from the edge
Not to be confused with
- Cache-aside
A CDN caches whole HTTP responses near the user; cache-aside is your app caching database results next to the database.
- Load balancer
A CDN answers from its own cache when it can; a load balancer always passes the request on to one of your servers.