The cache strategy that fits 90% of sites
A simple three-layer cache approach that has worked across every site we have audited this year.
Caching strategies become exotic fast - multi-region edge caches, surrogate keys, fragment caching. Most sites don't need any of that. A three-layer approach covers almost everything.
Layer 1: HTTP cache
Cache-Control headers on static assets. Versioned filenames so cache invalidation is automatic. Long max-age on hashed assets, short max-age on HTML.
This layer alone gives you 80% of the benefit. Most sites we audit have it set wrong - either too aggressive (stale HTML for hours) or too lax (no caching on JS that hasn't changed).
Layer 2: framework cache
Whatever your framework offers - Next.js Data Cache, WordPress object cache, Webflow's CDN. Use the defaults. Override only when measurements justify it.
The mistake here is over-caching. Caching pages that personalize per user produces wrong-user bugs. Cache only what's actually shareable.
Layer 3: application memory
For repeated work in a request - same data fetched twice in the component tree. React's cache() helper or the equivalent in your stack handles this. Often the framework already does it for you.
What we don't reach for
Manual edge caches with surrogate keys. Service workers caching assets aggressively. Per-user cache layers. They're rarely worth the complexity for a typical site.
If your three layers above are clean, you're ahead of most sites in production.