Compressie en caching instellen voor websites

Compressie en caching instellen voor websites

(Versnel je website door browser-caching en Gzip/Brotli in te schakelen)

Door statische bestanden (zoals afbeeldingen, CSS, JavaScript) te cachen in de browser van de bezoeker, hoeven ze bij een volgend bezoek niet opnieuw gedownload te worden. Compressie maakt de bestanden die wel verzonden moeten worden een stuk kleiner.

1. Compressie inschakelen (Gzip)

• Voor Nginx: Open /etc/nginx/nginx.conf en voeg toe:

  gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
gzip_comp_level 6;
gzip_min_length 1000;

• Voor Apache: Activeer mod_deflate:

  sudo a2enmod deflate && sudo systemctl restart apache2
  

  De standaardconfiguratie in /etc/apache2/mods-enabled/deflate.conf is meestal al goed.

2. Browser Caching headers instellen

• Voor Nginx: Voeg dit toe binnen je server { ... } blok:

  location ~* \.(jpg|jpeg|png|gif|ico|css|js|svg|woff|woff2|ttf)$ {
  expires 365d;
  add_header Cache-Control "public, no-transform";
}

• Voor Apache: Activeer mod_expires:

  sudo a2enmod expires && sudo systemctl restart apache2
  

  Voeg dit toe aan je .htaccess of virtual host configuratie:

  <IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/jpg "access plus 1 year"
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"
</IfModule>

3. Brotli compressie (Geavanceerd)

• Voor Nginx: Installeer de module:
  sudo apt install libnginx-mod-http-brotli
  Voeg daarna toe in nginx.conf:

  brotli on;
brotli_comp_level 6;
brotli_types text/plain text/css application/javascript application/json image/svg+xml application/xml+rss;

• Voor Apache: Installeer de module:
  sudo apt install brotli
  Activeer met:
  sudo a2enmod brotli

4. Test of het werkt

• Gebruik tools zoals PageSpeed Insights of GTmetrix om te controleren of compressie en caching actief zijn.

• Bekijk in je browser (F12 → Netwerk tab) de Response Headers van een bestand:

  • Content-Encoding: gzip of br (voor Brotli)

  • Cache-Control: max-age=...

Samenvatting

• Activeer Gzip of Brotli voor snellere bestandsoverdracht

• Stel caching headers in om herhaald downloaden te voorkomen

• Test je instellingen met online tools of browser developer tools

✅ Tip: Gebruik versiebeheer in bestandsnamen (zoals style.css?v=2) om cachingproblemen tijdens ontwikkeling te voorkomen.

Hulp nodig? Deel de URL van je website in je ticket. Wij inspecteren de headers en controleren of compressie en caching correct zijn ingesteld.