CDN Configuration
Distribute static assets and cacheable responses across globally distributed edge servers to reduce latency.
Description
A Content Delivery Network (CDN) is a globally distributed network of edge servers that cache and serve content from locations geographically close to end users. By serving static assets (JavaScript bundles, CSS, images, fonts) and cacheable API responses from edge locations, CDNs dramatically reduce latency, decrease origin server load, and improve resilience against traffic spikes and DDoS attacks.
CDN configuration involves defining cache behaviors that specify which requests to cache, for how long, and what constitutes a cache key. Static assets with content-hashed filenames (e.g., main.a1b2c3.js) can be cached aggressively with long TTLs (1 year) since the filename changes when content changes. Dynamic content may use shorter TTLs or stale-while-revalidate patterns. Cache invalidation strategies include versioned URLs (preferred), explicit purge APIs, and TTL-based expiration. The cache key typically includes the URL path and relevant query parameters, but can also incorporate headers (e.g., Accept-Encoding for content negotiation).
Modern CDNs (Cloudflare, AWS CloudFront, Fastly, Vercel Edge Network) offer features beyond caching: edge compute (running code at edge locations), image optimization (automatic format conversion and resizing), Web Application Firewall (WAF) rules, bot detection, DDoS protection, and custom response headers (security headers, CORS). Proper CDN configuration includes setting appropriate Cache-Control and Vary headers, enabling Brotli/gzip compression, configuring custom error pages, and setting up origin shield to reduce origin requests.
Prompt Snippet
Configure CloudFront distribution with an S3 origin for static assets and an ALB origin for the API. Set cache behaviors: static assets (/_next/static/*) with Cache-Control: public, max-age=31536000, immutable and CloudFront TTL of 1 year; API responses (/api/*) with no caching (Cache-Control: no-store) forwarding all headers and cookies to origin. Enable Brotli and gzip compression, configure Origin Access Control (OAC) for S3, add security response headers (Strict-Transport-Security, X-Content-Type-Options, X-Frame-Options) via CloudFront Functions. Set up origin failover with a secondary S3 bucket in another region for static asset resilience.
Tags
Related Terms
Static Asset Optimization
Optimize static assets (JS, CSS, images, fonts) for minimal size and efficient delivery to improve page load performance.
Reverse Proxy (Nginx/Caddy)
Route incoming HTTP requests through a reverse proxy that handles TLS termination, routing, and request buffering.
DNS Configuration
Configure DNS records to map domain names to server IP addresses, services, and other infrastructure endpoints.
Edge Computing
Execute application logic at edge locations worldwide, minimizing latency by running code geographically close to users.
SSL/TLS Certificate Management
Provision, configure, and renew SSL/TLS certificates to encrypt traffic between clients and servers.