HTTP caching is een mechanisme in het HTTP protocol waarmee browsers, CDNs en proxies kopieen van responses bewaren en hergebruiken voor latere verzoeken zonder de origin te benaderen. Het is de belangrijkste performance techniek op het web. Een goed gecachte statische asset (image, CSS, JS) laadt in 1 tot 10 ms uit de browser cache tegenover 100 tot 1000 ms vanaf de origin. HTTP caching wordt gestuurd door headers gedefinieerd in RFC 7234 (juni 2014) en RFC 9111 (juni 2022): Cache-Control, Expires (legacy), ETag en Last-Modified (validators) en Vary.
Hoe werkt het
- Cache hit als de kopie nog vers is.
- Conditional request met If-None-Match of If-Modified-Since, response 304.
- Cache miss zonder validator.
Cache-Control
| Directive | Betekenis |
|---|---|
max-age=N | Vers gedurende N seconden. |
s-maxage=N | Alleen gedeelde caches. |
public | Iedere cache mag opslaan. |
private | Alleen browser. |
no-cache | Revalideren voor gebruik. |
no-store | Nooit opslaan. |
stale-while-revalidate=N | Serveert stale tijdens revalidatie. |
immutable | Verandert nooit. |
Cache-Control: public, max-age=31536000, immutable
Cache-Control: public, max-age=0, s-maxage=300, stale-while-revalidate=86400
Cache-Control: private, no-cache
Cache-Control: no-storeETag
Opaque identifier (vaak hash). Client stuurt If-None-Match. Strong of weak (W/).
Last-Modified
Tijdstempel met 1 seconde resolutie. ETag is nauwkeuriger.
Vary
Vary: Accept-Encoding.Vary: Accept-Language.Vary: User-Agentvermijden.Vary: Cookiebreekt gedeelde cache.
Cache lagen
| Laag | Locatie | Volgt |
|---|---|---|
| Browser | Apparaat van gebruiker | max-age, ETag |
| CDN edge | PoP dichtbij (Cloudflare, Fastly, Akamai, CloudFront) | s-maxage, stale-while-revalidate |
| Bedrijfsproxy | Bedrijfsnetwerk | public, private |
| Service Worker | Pagina via JS | Eigen logica |
Cache busting en fingerprinting
webpack, Vite, esbuild, Turbopack, Rollup. app.css wordt app.a1b2c3d4.css.
HTTP caching in WordPress
- WP Rocket.
- LiteSpeed Cache.
- W3 Total Cache.
- WP Super Cache.
- Cloudflare APO 5 USD/maand.
Veelgemaakte fouten
- Lange max-age op HTML.
- Geen headers op statics.
- Vary: User-Agent.
- Set-Cookie met public.
- Pragma: no-cache.
- Cache poisoning zonder juiste Vary.
Testen
- DevTools Network.
curl -I.- WebPageTest.
- Lighthouse.
- RedBot.
HTTP/2 en HTTP/3
Zelfde caching semantiek. Server Push afgeschaft in Chrome sinds 2022, vervangen door Early Hints (RFC 8297).
Hoe helpt InspectWP?
InspectWP controleert Cache-Control, ETag, Last-Modified en Vary van elke asset.