System design deep dive
Content Delivery Network (CDN): deep dive
A CDN serves your content from servers a few milliseconds away from each user instead of from one distant origin, which makes pages faster and absorbs traffic spikes your origin could never handle. Interviews probe how caching keys, TTLs, and invalidation work at the edge.
How a CDN request works, step by step
- A user in Bengaluru requests
https://cdn.example.com/img/hero-a81f.webp. - DNS for the CDN hostname (via anycast or geo-aware resolution) returns the address of a nearby point of presence (PoP), such as Chennai or Mumbai.
- The edge server computes a cache key, usually the host plus path plus any query parameters and headers configured as significant.
- On a hit, the edge returns the object directly, often in 10 to 30 ms instead of the 200+ ms a round trip to a US origin would take.
- On a miss, the edge asks a regional mid-tier or origin shield. Only if the shield also misses does a request reach the origin.
- The origin replies with
Cache-Control: public, max-age=31536000, immutable; the edge and shield store the object and serve it to every later user in that region.
Beyond latency, the CDN is a bandwidth shield. If a 2 MB video thumbnail sprite is requested 50 million times a day with a 98% hit rate, the origin serves about 2 TB instead of 100 TB.
What to put on a CDN
- Static assets: JS and CSS bundles, fonts, images. Use fingerprinted filenames so they can be cached for a year.
- Media: video segments for HLS or DASH streaming, podcast files, downloads.
- Cacheable API responses: public, non-personalized data such as a product listing, with short TTLs like 30 to 60 seconds.
- Whole pages for logged-out users, with
stale-while-revalidateto hide origin latency. - Not per-user responses (a cart, a feed) unless you are deliberately using edge compute; caching those risks serving one user's data to another.
Cache-control and invalidation strategies
| Technique | How it works | Best for |
|---|---|---|
| Versioned URLs | File name includes a content hash; new deploy means new URL | JS, CSS, images: instant, safe updates |
| Short TTL | max-age=60 so content refreshes every minute | Semi-dynamic JSON, homepages |
| stale-while-revalidate | Serve stale copy instantly while fetching a fresh one | Hiding origin latency on popular pages |
| Purge API | Explicitly evict a path or tag from all PoPs | Takedowns, urgent corrections |
| Surrogate keys / tags | Tag objects, purge every object with a tag at once | Invalidating all pages that show product 42 |
When a CDN helps (and when it does not)
A CDN gives the biggest win when your users are geographically spread out and a large share of bytes is identical for everyone. It also helps security: many CDNs absorb DDoS floods and provide a web application firewall at the edge. It helps little for a single-region internal tool, for write-heavy APIs, or for highly personalized responses, though even then a CDN can still terminate TLS close to the user and keep a warm connection back to origin, saving a few round trips.
Common mistakes in interviews
- Saying put it on a CDN without explaining how a deploy invalidates old content.
- Including cookies or session headers in the cache key, which drops the hit rate to near zero.
- Forgetting the origin shield and letting hundreds of PoPs each miss independently after a purge, hammering the origin.
- Caching authenticated responses with
public, leaking private data across users. - Not mentioning that a CDN is also a cost decision: egress from a CDN is often cheaper than egress from cloud origin servers.
Interview questions
›What is the difference between a push CDN and a pull CDN?
With a pull CDN, edges fetch content from the origin the first time it is requested and cache it, so setup is easy and only requested content is stored. With a push CDN, you upload content ahead of time, which suits large files that are known in advance, such as a game patch, but requires managing uploads and storage.
›How do you deploy a new frontend without users seeing a broken mix of old and new files?
Fingerprint every asset (app.3f9c1.js) and cache it for a year, while serving the HTML that references them with a short TTL or no-cache. A new deploy changes the HTML to point at new URLs, so old and new assets never collide.
›What is an origin shield and why use one?
It is a designated mid-tier cache between the edge PoPs and the origin. All edge misses go to the shield first, so the origin sees roughly one request per object per TTL instead of one per PoP. It dramatically reduces origin load after purges or for long-tail content.
›How does a CDN help with video streaming?
Videos are split into small segments of a few seconds, each at multiple bitrates, and every segment is a cacheable file. Popular titles get very high hit rates at the edge, and the player switches bitrates based on bandwidth while still fetching cached segments.
›Can a CDN serve dynamic content?
Partially. It can cache short-lived public responses, use edge functions to run logic near the user, and accelerate uncached requests through optimized routes and persistent connections to the origin. Truly per-user data is still produced by the origin.