Varnish caching afdwingen op LWS

Procédure

In deze documentatie leggen we stap voor stap uit hoe je Varnish en browsers kunt dwingen om je bronnen in de cache te houden, zelfs als ze Pragma: no-cache of Cache-Control: no-cache verzoeken sturen.

1. Context en LWS-architectuur

LWS shared hosting en managed cPanel/VPS pakketten zijn gebaseerd op de :

Browser ⇄ NGINX (SSL + HTTP/2) ⇄ Varnish Cache ⇄ Apache/PHP-FPM

• NGINX beheert TLS en comprimeert inhoud.
• Varnish (Fastest Cache) wordt gebruikt als een reverse proxy om HTTP-reacties op te slaan.
• Apache of PHP-FPM genereren het uiteindelijke antwoord als Varnish geen HIT heeft.

Als alles correct is geconfigureerd, kan Varnish tot 1000 keer sneller zijn dan directe toegang tot PHP, terwijl de CPU van de server wordt ontlast.

2. Herinnering: hoe beslist Varnish om te cachen?

[tips]Varnish negeert standaard de Cache-Control: no-cache die door de browser wordt verzonden voor statische bestanden, maar respecteert de "revalidatielogica" als het object al in de cache staat[/tips].

3. Controleer de levensduur via .htaccess

Activeer de mod_headers module (dit is de standaard bij LWS) en plaats dan het volgende fragment waar je maar wilt:

  Header set Cache-Control "public, max-age=3600, s-maxage=3600, stale-while-revalidate=60, stale-if-error=86400" Header set Expires "Thu, 31 Dec 2037 23:55:55 GMT"

• max-age: duur (in seconden) in de browser.
• s-maxage: specifieke duur voor gedeelde caches (Varnish/CDN).
• stale-while-revalidate: staat toe dat Varnish oudbakken inhoud serveert terwijl het deze op de achtergrond ververst.
• stale-if-error: serveert de verouderde versie als het backend een foutmelding geeft (fail-safe).

3.1 Targeting per map

Door hetzelfde .htaccess-bestand in de map "/images/" te zetten, wordt de regel alleen toegepast op de map "images".

3.2 Gericht op extensie

  
    Header set Cache-Control "public, max-age=2592000, s-maxage=2592000, immutable".  

immutable: vertelt de browser dat er geen revalidatie nodig is totdat het object is verlopen; ideaal voor bestanden met versiebeheer (style.483bf.css).

3.3 Korte cache voor HTML

  Header set Cache-Control "public, max-age=300, s-maxage=600, must-revalidate".

Verloopt na 5 min client-side en 10 min Varnish-side, daarna must-revalidate.

4. Echte gebruiksscenario's

5. De cache wissen of ongeldig maken

1. Vanuit het LWS-paneel: Optimalisatie & Prestaties > LWS Cache > Cache leegmaken.
2. HTTP PURGE (indien ingeschakeld):

   curl -X PURGE -H "Host: example.com" https://exemple.com/chemin/ressource.jpg

3. Ban door expressie (geavanceerde VCL):

   ban req.http.host == "example.com" && req.url ~ "/images/"

6. Testen en debuggen

curl -I https://exemple.com/style.css

Kijken naar :

• Leeftijd: 356 → Varnish heeft een antwoord van 356 s geserveerd.
• Cache-Control: public, max-age=2592000, s-maxage=2592000, immutable
• X-Cache: HIT (of MISS).

Met Chrome/Edge: DevTools > Netwerk > Cache uitschakelen kan een eerste bezoeker worden gesimuleerd.

7. Veelvoorkomende valkuilen

1. Onnodige cookies: veel WordPress-thema's plaatsen een cookie, zelfs voor openbare pagina's. Verwijder ze of schakel ze uit via functions.php.
2. Query strings: standaard creëert ?v=123 een nieuw item in de cache. Versie in plaats daarvan in de bestandsnaam.
3. Gevoelige inhoud: formulieren, pagina's over klanten ➡ no-store, private, max-age=0.
4. Brotli/Gzip compressie: activeer deze vóór de Varnish laag om dubbele caching te voorkomen.

8. Samenvatting van best practices

• Gebruik s-maxage ⩾ max-age om een proxy cache aan te houden die langer is dan de browser cache.
• Zet immutable op elk bestand waarvan de naam een hash bevat.
• Meng Obsolete Expires niet met max-age, behalve voor oudere browsers.
• Documenteer je TTL's in een CACHE_POLICY.md bestand voor het team.

9. Nuttige bronnen

• LWS: Versnel uw site met Fastest Cache
• LWS blog: Hoe je een beter presterende site krijgt met Varnish Cache

Je Varnish cache is nu onder controle!