A CDN (Content Delivery Network) caches your site’s files on servers around the world, so visitors download assets from a location near them instead of from your origin. The practical default for most sites in 2026 is Cloudflare’s free or Pro plan, which combines a global edge network with security and image optimization at a hard-to-beat price.
What Is a CDN?
A CDN is a distributed network of servers that store copies of your website’s static files (images, CSS, JavaScript, fonts, videos) and serve them from the location closest to each visitor. Without a CDN, every visitor downloads files from your origin server, which might sit in Virginia even when the visitor is in Singapore. That round trip across oceans adds hundreds of milliseconds to every request.
With a CDN in front of your site, that Singaporean visitor pulls the same files from a nearby server instead. The page renders faster, the origin handles less traffic, and the experience feels snappier no matter where the user lives. Modern CDNs also terminate TLS, block bots, mitigate DDoS attacks, optimize images on the fly, and run code at the edge. For a deeper look at the hosting layer the CDN sits in front of, our website hosting guide walks through the full stack.
How a CDN Works
Your origin is where the canonical version of your site lives (a VPS, a managed WordPress host, a Vercel deployment, an S3 bucket). It holds the source of truth.
The edge nodes are servers spread across data centers worldwide. When a visitor requests a file, the nearest edge checks its cache. If the file is there and still fresh, the edge serves it directly (a cache hit). If not, the edge fetches it from your origin, stores a copy, and serves it (a cache miss, then a fill).
The routing layer (usually anycast DNS) directs each visitor to the closest healthy edge automatically. You point your domain’s DNS at the CDN and it takes care of the rest. Subsequent requests from the same region hit warm caches and skip the origin entirely, which is where the speed gains come from.
Benefits of Using a CDN
Speed. Edge delivery typically shaves 100 to 500 milliseconds off Time to First Byte for distant users, and image optimization can cut total page weight by 40 percent or more. See our Time to First Byte guide for what TTFB measures and how to improve it.
Reliability. If your origin goes down, a properly configured CDN can keep serving cached content for hours or days. Cloudflare’s “Always Online” and Fastly’s stale-while-revalidate turn outages into degraded performance instead of total downtime.
Security. Every major CDN includes DDoS mitigation, a web application firewall, and bot management. Origin IP hiding alone blocks a huge class of direct-to-origin attacks.
Cost. Offloading 80 to 95 percent of traffic from the origin means you can run on a smaller server, pay less for egress bandwidth, and absorb traffic spikes without scaling drama. The CDN often pays for itself in saved hosting bills.
When You Don’t Need a CDN
A CDN is overkill for internal tools used only by people on your office network, for pure development or staging environments meant for a handful of developers in one city, and for highly dynamic personalized dashboards where every byte is unique to the logged-in user (in that case the CDN value drops to security and TLS termination only).
For everything else (marketing sites, blogs, SaaS landing pages, ecommerce, media, documentation), a CDN is a clear win. The free tiers from Cloudflare and Bunny mean cost is rarely the reason to skip it.
Top CDN Providers Compared
Cloudflare dominates by footprint (320+ cities) and is the default for most sites. Generous free tier, excellent security tooling, Workers for edge compute, per-request pricing on paid plans. Downside: high-bandwidth video gets expensive without their Stream product.
Fastly is the pick for engineering teams that want fine-grained control. Real-time configuration via VCL or its newer Compute platform, instant purges measured in milliseconds, best-in-class observability. Pricing starts higher and the learning curve is steeper.
Bunny CDN wins on price-to-performance for video and static asset delivery. Flat per-GB pricing with no minimums, a clean dashboard, an excellent image processing API. Smaller security feature set than Cloudflare, so pair it with a separate WAF if you need one.
AWS CloudFront makes sense when your origin is already in AWS (S3, EC2, Lambda). Tight integration with the rest of the AWS stack, Lambda@Edge for compute, pay-as-you-go pricing. Configuration is verbose and pricing gets complicated across regions.
Akamai remains the enterprise heavyweight for media companies, banks, and Fortune 500 sites. Outstanding security and global reach, but pricing typically starts in the thousands per month.
KeyCDN is a solid mid-market option with straightforward per-GB pricing and easy setup. Smaller network than Cloudflare but a good fit for teams that want a simple service without the feature sprawl.
Choosing the Right CDN
Four factors drive the choice. Pricing model matters most for high-bandwidth sites: per-GB billing (Bunny, KeyCDN) is predictable, while per-request billing (Cloudflare paid plans) favors lots of small assets. Regional coverage matters if your audience is concentrated outside North America and Europe (check that the provider has PoPs in your target markets). Features matter when you need specific capabilities like edge compute, image optimization, or a managed WAF. Developer experience matters more than people admit.
For 90 percent of sites starting out, Cloudflare’s free plan is the right call. Move to Bunny if video bandwidth dominates your bill, to Fastly if you need millisecond purges and advanced edge logic, or to CloudFront if you’re already deep in AWS.
How to Set Up a CDN
The setup pattern is similar across providers. Here’s the flow using Cloudflare.
- Add your domain. Cloudflare scans existing DNS records and imports them. Review the list and remove anything stale.
- Change nameservers at the registrar. Cloudflare gives you two nameservers. Update these at your registrar. Propagation usually completes in under an hour.
- Set DNS records to proxied. Click the gray cloud next to each record to turn it orange. Orange means traffic flows through Cloudflare. Gray means DNS only (origin IP exposed).
- Enable SSL/TLS in Full (strict) mode. This forces HTTPS end to end and validates the origin certificate. Our SSL certificate setup guide covers the certificate side.
- Configure caching rules. The default cache level caches static assets by file extension. Add Page Rules or Cache Rules to extend caching to HTML or bypass it for specific paths.
- Test from multiple regions. Use WebPageTest to load your site from Tokyo, Sydney, Frankfurt, and Sao Paulo. Confirm cache headers (cf-cache-status: HIT) and check TTFB improvements.
Cache Configuration
Static assets (images, CSS, JS, fonts) should cache for a long time, ideally one year. Use fingerprinted filenames (style.a3f9.css) so you can bust the cache by changing the filename instead of waiting for TTL expiration.
HTML is trickier. If your pages are mostly static, cache them for a few minutes to an hour at the edge and use stale-while-revalidate. If pages contain personalized blocks, cache them only for logged-out users (vary by cookie) or skip HTML caching entirely.
API responses usually shouldn’t cache by default. For public read-heavy endpoints, set explicit Cache-Control headers with short TTLs and use surrogate keys so you can purge by tag when data changes.
Query strings need attention. By default many CDNs treat /page and /page?utm_source=twitter as different cache keys, which means a single tracking parameter destroys your hit ratio. Configure the CDN to ignore tracking params (utm_*, fbclid, gclid).
Cache Invalidation Strategies
URL-based purge. Hit a specific URL and the CDN drops it from cache. Useful for one-off updates. Cloudflare and Fastly purges propagate globally in seconds.
Tag-based purge. Attach a surrogate key (Cache-Tag header) to responses, then purge by tag when underlying data changes. The right pattern for ecommerce or CMS sites where one database change affects many URLs (a product price update should invalidate the product page, category page, and homepage simultaneously).
Versioned URLs. Instead of purging, change the URL. Append a hash or version number to asset URLs (app.v2.js, hero.png?v=3) and let old cached versions expire on their own TTL.
Security Features to Enable
- Web Application Firewall (WAF). Blocks SQL injection, XSS, and known attack signatures. Cloudflare’s managed rules and AWS WAF’s core rule set catch the OWASP Top 10 out of the box.
- Bot management. Distinguishes good bots (Googlebot, Bingbot) from scrapers and credential stuffers.
- DDoS protection. On by default at most CDNs. Cloudflare and Akamai have absorbed terabit-scale attacks without operator intervention.
- Hotlink protection. Prevents other sites from embedding your images and stealing bandwidth.
- Rate limiting. Throttle abusive clients. Critical for login pages, signup forms, and API endpoints.
- HSTS and TLS 1.3. Force HTTPS with HSTS preload and enable TLS 1.3 for faster handshakes.
For a fuller security posture covering authentication, headers, and server hardening, see our website security best practices.
Common CDN Mistakes
Wrong Cache-Control headers. Setting Cache-Control: no-cache on every response means nothing ever caches. Audit your origin response headers and remove blanket no-cache directives.
Mixed content warnings. Loading HTTP assets on an HTTPS page triggers browser warnings and broken images. Use protocol-relative URLs or enable Cloudflare’s Automatic HTTPS Rewrites.
Origin fall-through under load. If your cache hit ratio is low and origin starts failing under traffic, the CDN amplifies the problem by retrying. Set sensible origin timeouts, enable stale-if-error, and monitor the hit ratio.
Caching authenticated pages. Caching a logged-in account page can leak that page to other users. Always vary on the session cookie or skip caching for authenticated requests.
Origin IP leaks. If your origin IP is in DNS history or a misconfigured email header, attackers can bypass the CDN. Rotate the origin IP after switching to a CDN and lock down origin firewall rules to accept only CDN IP ranges.
Measuring CDN Effectiveness
Cache hit ratio is the percentage of requests served from edge cache instead of origin. Above 90 percent for static-heavy sites is healthy. Below 70 percent suggests cache misconfiguration (often query strings or cache-busting headers).
Time to First Byte (TTFB) measured from multiple regions tells you whether edge delivery is faster than origin. Compare TTFB with the CDN on and off to confirm the gain. Expect 50 to 300 millisecond improvements for users far from your origin.
Error rate at the edge (4xx and 5xx) catches problems early. A spike in 5xx usually means origin issues bleeding through. A spike in 4xx might be a misconfigured cache rule or a security feature blocking legitimate traffic. Most CDNs surface these in their dashboards. Set up alerts so you find out about regressions before users do.
Ready to put your site on a faster, more resilient foundation? Get in touch with Framer Websites and we’ll help you pick the right CDN, configure it properly, and integrate it cleanly with your stack.
Frequently Asked Questions
Is Cloudflare free really good enough for production?
For most marketing sites, blogs, and small SaaS apps, yes. The free plan includes unlimited bandwidth, the global anycast network, basic DDoS protection, free TLS certificates, and a Workers allowance. Paid plans add advanced WAF rules, image optimization, and analytics, but the free tier handles real production traffic for millions of sites every day.
How long does CDN setup take from start to finish?
The technical work is usually under an hour: create the account, add the domain, change nameservers, set basic cache rules, test. The waiting (DNS propagation, validating cache behavior, tuning hit ratio) takes longer. Plan for half a day to do it properly, and a few days of monitoring afterwards to catch edge cases.
Will a CDN break my site?
It can if you misconfigure caching. The two highest-risk failure modes are caching authenticated pages (which can leak data between users) and aggressive HTML caching on a site with frequently changing content. Start with static assets only, validate, then extend caching to HTML once you trust the setup. Always have a quick rollback plan.
Do I still need a CDN if my host has one built in?
Managed hosts (Vercel, Netlify, Cloudflare Pages, WP Engine) include a CDN as part of the product, so you typically don’t need a separate layer. The exception is when you want features the built-in CDN doesn’t offer (advanced WAF rules, specialized image processing, edge compute), in which case stacking a second CDN in front can make sense.