Multi-level Caching: Browser → CDN → Varnish → Redis → DB

We've worked on projects where every page request turned into dozens of SQL queries. Even a simple blog crawled. After implementing multi-level caching, response time dropped from 2000 ms to 80 ms, and database load decreased by 95%. Clients significantly reduce infrastructure costs after such optimization. Here's how to build this system.

Multi-level caching is a sequence of storage layers for responses. Each layer serves a request without passing it further. The closer to the user a cache hit occurs, the faster the response. A proper strategy reduces load on the database and application server, and improves Core Web Vitals.

Why One Level Is Not Enough?

Browser cache saves traffic but doesn't help on first visit. CDN accelerates static delivery, but dynamic pages need a faster layer. Varnish is a powerful reverse proxy but can't store complex data structures. Redis solves this but requires RAM. The combination of these tools gives maximum effect: a typical site after setup gets hit rate >80% on CDN and >70% on Varnish.

Recommended TTLs for Different Content Types

These TTLs should be adjusted based on content change frequency. For a news portal, HTML is better cached for 2 minutes; for a corporate site, one hour. We always run load testing to ensure hit rate meets target values.

How to Configure Browser Caching?

# nginx: headers for browser cache location ~* \.(jpg|jpeg|png|gif|ico|css|js|woff2)$ { expires 1y; add_header Cache-Control "public, immutable"; } location ~* \.html$ { add_header Cache-Control "public, max-age=0, s-maxage=300"; add_header Vary "Accept-Encoding, Accept-Language"; } 

The immutable directive tells the browser not to revalidate the file — it's guaranteed not to change. This gives instant loading on repeat visits.

How to Connect a CDN?

# cloudflare page rules - pattern: "*.company.com/assets/*" settings: cache_level: cache_everything edge_cache_ttl: 2592000 # 30 days browser_cache_ttl: 31536000 # 1 year 

CDN offloads the origin and reduces TTFB for geographically distant users.

Varnish: Fine Tuning

vcl 4.1; backend default { .host = "app-server"; .port = "8080"; } sub vcl_recv { if (req.http.Authorization || req.http.Cookie ~ "session") { return (pass); } if (req.method != "GET" && req.method != "HEAD") { return (pass); } unset req.http.Cookie; return (hash); } sub vcl_backend_response { if (beresp.status == 200 || beresp.status == 301) { if (beresp.http.Content-Type ~ "text/html") { set beresp.ttl = 5m; } else if (beresp.http.Content-Type ~ "application/json") { set beresp.ttl = 1m; } unset beresp.http.Set-Cookie; } set beresp.grace = 1h; } sub vcl_deliver { if (obj.hits > 0) { set resp.http.X-Cache = "HIT"; } else { set resp.http.X-Cache = "MISS"; } } 

According to the Varnish Cache documentation, the grace period allows serving stale cache when the backend is unavailable, improving availability. The hash key can be customized to separate cache by language or device.

How to Solve Cache Invalidation?

Without proper invalidation, users see stale data. We design a unified system: on data changes, HTTP PURGE is sent to Varnish, Redis keys are deleted, and CDN tags are purged. Example in Python:

def on_product_updated(product_id): redis.delete(f"product:{product_id}") requests.request('PURGE', f"http://varnish:6081/products/{product_id}") # Cloudflare purge by tag requests.post(f"https://api.cloudflare.com/client/v4/zones/{zone_id}/purge_cache", headers={"Authorization": f"Bearer {token}"}, json={"tags": [f"product-{product_id}"]}) 

A common mistake is setting too long TTLs without an invalidation mechanism. We recommend using tags on CDN and PURGE on Varnish to ensure data freshness. In some scenarios, we use Edge Functions for instant invalidation at the network edge.

Monitoring Hit Rate by Level

We use Prometheus metrics: varnish_main_cache_hit / (varnish_main_cache_hit + varnish_main_cache_miss), redis_keyspace_hits_total / (redis_keyspace_hits_total + redis_keyspace_misses_total). Target values are listed in the table above. Regular monitoring allows timely TTL adjustments and identifies invalidation issues.

What's Included in the Work?

1. Audit of current caching architecture — analyzing nginx logs, Varnish configs, Redis parameters, and CDN structure.
2. Browser Cache setup via nginx or .htaccess.
3. CDN (Cloudflare, CloudFront) connection with caching rules.
4. Varnish (4.1+) installation and configuration with grace and hash rules.
5. Redis (cluster, persistence, eviction policy) configuration.
6. Creation of a unified invalidation system with PURGE and API.
7. Load testing and TTL optimization.
8. Documentation and team training.

Timeline and Cost

Setting up the full stack takes 4 to 7 working days. Cost is calculated individually based on project complexity. Clients typically recoup the investment in 2–3 months through reduced server costs and increased conversion.

Common Mistake: Incorrect TTL Settings

Many set identical TTLs for all content types. This leads either to over-caching of dynamic data or too frequent invalidation of static files. We choose TTLs based on content update frequency: static — one year, HTML — 5 minutes, JSON API — 1 minute. After configuration, we check hit rate and adjust as needed.

Order a cache audit today — we'll identify bottlenecks and propose the optimal strategy. Get a consultation on multi-level caching setup for your project.