Optimaliseren snelheid - WordPress caching instellen (aanbevolen)

Om je website vele malen sneller uit te laden raden we aan om caching in te stellen op de website. Op die manier worden de pagina's direct in het geheugen van de server geplaatst, en kunnen deze vele malen sneller uitgeladen worden. Wij raden hiervoor de LiteSpeed Cache plugin aan in WordPress, gezien deze naadloos aansluit op onze LiteSpeed servers, en bovendien ook tal van optimalisatie instellingen beschikbaar heeft om de website nog sneller te maken.

Wat is Caching?

Een cache is een onderdeel van het geheugen van de server. Hier wordt recent en/of veelgebruikte informatie opgeslagen. Wanneer een webpagina wordt opgevraagd, worden alle onderdelen om de website uit te serveren aangeroepen (database, PHP-scripts, afbeeldingen, CSS bestanden etc), en wordt het resultaat van alle scripts uitgeserveerd. Via dat proces, wat nog steeds maar van korte duur is (gemiddeld tussen de 200ms en 3 seconden) duurt, worden alle PHP-scripts aangeroepen en worden berekeningen opnieuw uitgevoerd. 

Wanneer een site gecached is, betekent dat enkel het resultaat (de cache) van de scripts wordt getoond (je website wordt uit de cache geserveerd). Dit is een zeer efficiënte manier om je website zeer snel te maken. Bijvoorbeeld wanneer je 10 website bezoekers ontvangt op een gegeven moment, dan wordt bij de eerste bezoeker de website normaal uitgeladen en vervolgens meteen in de cache gezet. Bij de volgende 9 bezoekers wordt de website dan enkel uit cache geladen, waardoor de laadtijd vele malen korter is. 

Standaard instellingen

Om direct aan de slag te gaan hebben we onderstaande import bestand alvast voor je aangemaakt. Hierin zijn alle caching instellingen al correct gezet en hoef je enkel nog de optimalisatie opties aan te passen. 

Je kunt dit bestand inladen via de pagina 'LiteSpeed Cache > Toolbox > Import/Export'.

litespeed-instellingen.data

Voorbereidingen voor instellen cache

Allereerst is het noodzakelijk om een aantal zaken te activeren in het hosting account (standaard zullen deze al ingeschakeld zijn), en om eventuele huidige caching oplossingen in de website te deactiveren.

1. Log in op cPanel en ga naar 'Select PHP version' onder het kopje Software
2. Vink hier de OPCACHE en APCU module aan en sla de pagina op
3. Log in op het WordPress dashboard en deactiveer en verwijder alle bestaande caching plugins (W3 Total Cache, Fastest Cache, WP Rocket, Autoptimize, WP Super Cache etc)
4. Zorg ervoor dat je .htaccess bestand schoon is (enkel de basis htaccess inhoud zoals hieronder) en dat er geen caching configuratie is overgebleven. Vaak is alleen het volgende over, en misschien nog een redirect rule voor SSL:

# BEGIN WordPress
<IfModule mod_rewrite.c> 
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond%{REQUEST_FILENAME} !-f
RewriteCond%{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

Instellen LiteSpeed cache

1. Installeer en activeer de plugin “LiteSpeed Cache” (https://wordpress.org/plugins/litespeed-cache/)
2. In principe is de caching hiermee al correct ingesteld. Voor de volledigheid raden we echter aan nog wat extra instellingen in te schakelen om ook de browsercache te activeren.

3. Open 'LiteSpeed Cache > Cache' en controleer of 'Enable Cache' geactiveerd is

   

4. Open vervolgens het tabblad '[7] Browser', en vink hier ook de Browser caching aan

   

LiteSpeed optimalisatie instellingen

Standaard staat LiteSpeed Cache enkel ingesteld om de pagina's in de cache te plaatsen. Indien gewenst kun je ook de code optimaliseren voordat deze in de cache geplaatst wordt. Dit zal zorgen voor een veel betere score en snelheid van de website, maar afhankelijk van de functionaliteiten binnen de website kan hier wel wat extra finetuning voor nodig zijn.

Zie onderstaand de optimale instellingen om te gebruiken. Let wel op dat je na het instellen hiervan de website goed controleert op juiste werking. Je kunt deze instellingen vinden via 'LiteSpeed Cache > Pagina optimalisatie'.

[1] CSS instellingen

[2] JS instellingen

[3] HTML instellingen

[4] Media instellingen

[5] VPI

[6] Media excludes

[7] Localizations

[8] Tuning

[9] Tuning - CSS

Cache legen

Let op: Als je wijzigingen hebt doorgevoerd in je website en je wilt dat dat direct voor alle bezoekers in beeld komt, moet je de LiteSpeed Cache legen. Log in op je WordPress Dashboard, klik LiteSpeed Cache en kies Verwijder alle cache (Purge All):