CDN (Content Delivery Network) - Complete Deep Dive

Prerequisites: Caching, Load Balancing Used in: Netflix, Instagram, URL Shortener, any system serving media or static content globally


What is a CDN?

A CDN is a network of servers distributed worldwide (edge servers) that cache and serve content from the location nearest to the user.

Real-world analogy: Amazon warehouses. Instead of shipping every order from one central warehouse in Seattle (high latency, expensive), Amazon puts warehouses in every major city (edge locations). Your package comes from 20 miles away, not 2000.

Without CDN:
  User in Mumbai → requests image → travels to server in US → 200ms
  User in London → requests image → travels to server in US → 150ms

With CDN:
  User in Mumbai → requests image → CDN edge in Mumbai → 10ms
  User in London → requests image → CDN edge in London → 10ms

How a CDN Works

First request (cache MISS):
  User → CDN Edge (Mumbai) → "I don't have this" → Origin server (US) → returns image
  CDN Edge caches the image locally
  Returns to user (slow this one time)

Subsequent requests (cache HIT):
  User → CDN Edge (Mumbai) → "I have this!" → returns immediately (fast)
  Origin server not contacted at all
flowchart TD
    A[User in Mumbai] --> B{CDN Edge in Mumbai}
    B -->|Cache HIT| C[Return immediately]
    B -->|Cache MISS| D[Origin Server US-East]
    D --> E[Returns content]
    E --> F[CDN Edge caches it]
    F --> G[Future requests served locally]

    classDef client fill:#f97316,stroke:#c2410c,color:#fff
    classDef service fill:#10b981,stroke:#065f46,color:#fff
    classDef data fill:#fbbf24,stroke:#92400e,color:#000
    class A client
    class B,F service
    class D data
    class C,E,G service

Pull vs Push CDN

Pull CDN (Lazy — most common)

CDN fetches content from origin only when first requested. If no one requests it, it’s never cached at that edge.

Flow:
  User requests file → CDN doesn't have it → pulls from origin → caches → serves
  Next user requests same file → CDN has it → serves from cache

Pros: Only caches what’s actually popular. No upfront setup. Cons: First user gets slow response (origin fetch). Edge might not have content during spikes. Used by: Cloudflare, CloudFront (default), most CDNs.

Push CDN

You explicitly upload content to CDN edge servers. CDN serves it without ever contacting your origin.

Flow:
  You upload video to CDN → CDN distributes to all edges
  User requests video → CDN has it immediately → serves

Pros: First request is always fast. You control exactly what’s cached. Cons: Storage cost (paying for all edges). Must manage uploads. Stale content if you forget to update. Used by: Netflix (pre-positions popular content on ISP servers), video platforms.

Which to Use?

Content Type Best Approach
Static assets (CSS, JS, images) Pull CDN
User-uploaded media (profile pics) Pull CDN
Popular video content Push CDN (pre-position)
Live streaming Specialized CDN (not cached)
API responses Usually NOT CDN (dynamic), unless cacheable

What to Cache on CDN

Cache Don’t Cache
Static files (CSS, JS, fonts) User-specific data (dashboard, settings)
Images, videos, PDFs Authentication tokens
Public API responses (product catalog) Real-time data (stock prices, chat)
HTML pages (for anonymous users) POST/PUT/DELETE responses

Cache Invalidation on CDN

When you update content, how do you make the CDN serve the new version?

Strategy 1: Versioned URLs (Best)

v1: /static/app.v1.js
v2: /static/app.v2.js (new URL = CDN treats as new file = no stale cache)

CDN caches indefinitely. New deployment = new URL. Old URL still works for users with old HTML.

Strategy 2: Cache-Control Headers

Cache-Control: public, max-age=86400  (cache for 24 hours)
Cache-Control: no-cache  (always revalidate with origin)
Cache-Control: no-store  (never cache)

Strategy 3: Purge API

Most CDNs offer an API to force-invalidate cached content.

POST /purge {"urls": ["https://example.com/image.png"]}
→ CDN removes from all edges → next request fetches fresh from origin

Trade-off: Purge takes time to propagate (seconds to minutes across all edges).


CDN Performance Numbers

Metric Without CDN With CDN
Latency (US user, US server) 50ms 10ms
Latency (India user, US server) 200ms 15ms (served from India edge)
Origin server load 100% of requests 5-10% (90%+ served by CDN)
Bandwidth cost High Lower (CDN absorbs most traffic)
Availability during origin outage 0% Partial (cached content still served)

CDN Providers

Provider Best For Unique Feature
Cloudflare General web, DDoS protection Free tier, Workers (edge compute)
AWS CloudFront AWS ecosystem Tight S3 integration, Lambda@Edge
Fastly Real-time purging Instant purge (< 150ms globally)
Akamai Enterprise, largest network 300K+ edge servers
Google Cloud CDN GCP ecosystem Global anycast, load balancing

Edge Computing (CDN + Logic)

Modern CDNs can run code at the edge (not just cache static files):

Traditional: User → CDN (static only) → Origin (all logic)

Edge computing: User → CDN Edge (runs simple logic like auth, redirects, A/B testing) → Origin (only for DB queries)

Examples:

Use cases:


CDN in System Design Interviews

When to mention CDN:

How to talk about it:

“User-uploaded images are stored in S3. We put CloudFront in front of S3 so images are served from the nearest edge location. First request goes to origin, subsequent requests are served from cache with ~10ms latency. We use versioned URLs for cache busting.”


Common Interview Questions

Q: “How does a CDN reduce latency?” A: “Content is served from an edge server geographically close to the user (10-20ms) instead of traveling to the origin (100-300ms). Physics — speed of light through fiber has a floor.”

Q: “What if the origin goes down?” A: “CDN continues serving cached content. Users see existing content but can’t get new content. This is ‘stale-while-error’ — better than a complete outage.”

Q: “How do you handle personalized content with a CDN?” A: “Don’t cache personalized content on CDN. Use CDN only for static/public assets. Personalized API responses go directly to origin servers. Or use edge computing to assemble personalized pages from cached fragments.”

Q: “CDN vs Read Replica?” A: “CDN caches the final rendered content (bytes). Read replica caches at the database level (queries). CDN eliminates the server entirely for cached requests. Use both: CDN for static content, replicas for dynamic database queries.”


← Back to Fundamentals ← Database Sharding Next: Distributed Locking →

💬 Comments