Optimaliseren snelheid – WordPress caching instellen (aanbevolen)
Op het moment dat je je website wilt optimaliseren voor maximale performance, dan kun je gebruik maken van verschillende caching technieken. Onderstaand de uitleg om de optimalisatie voor je website uit te voeren voor websites die draaien op een Everts Webservices server die gebaseerd is op de ‘Litespeed’ technologie. Door gebruik te maken van de Litespeed Cache plugin voor WordPress is je site sneller dan met andere caching plugins van WordPress.
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’.
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.
De cache van jouw website of webshop wordt automatisch opnieuw aangemaakt op het moment dat een gebruiker een wijziging aan de website doet.
Stap 1: cPanel instellingen
- Log in op de betreffende cPanel
- Ga naar ‘Select PHP version’ onder het kopje Software > SELECT PHP VERSION
- Daar vink je OPCACHE + APCU aan als dat nog niet het geval is
- Klik op save/opslaan
Stap2: Optimaliseren WordPress op de LiteSpeed server
- Voordat je gaat optimaliseren is het vaak verstandig om een aantal benchmark tests uit te voeren zodat je weet of de performance vooruit gegaan is. Je kunt de volgende tools gebruiken hiervoor. Let op, je kunt vaak een locatie kiezen van waaruit getest wordt. Kies een locatie die zo dicht mogelijk bij Amsterdam ligt voor de meest accurate resultaten:- https://www.webpagetest.org/– https://tools.pingdom.com/– https://gtmetrix.com
- Log in op je wp-admin omgeving.
- Let op: Verwijder alle bestaande caching en optimalisatie plugins.
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
Installeer en activeer de plugin “LiteSpeed Cache” (https://wordpress.org/plugins/litespeed-cache/) Als deze correct is geinstalleerd, zie je ‘LiteSpeed Cache’ in het WordPress admin menu staan.
- Als de plugin is geïnstalleerd, open je vervolgens een Chrome Incognito Window (windows: Ctrl+Shift+N, Mac: Cmd+Shift+N) en ga naar je website.
- Indien je Woocommerce gebruikt is het niet nodig pagina’s uit te sluiten, al is het wel verstandig om even te testen. Enkel bij custom functies zien we nog wel eens een issue.
Standaard staat LiteSpeed Cache al prima qua instellingen. Wil je echt het maximale eruit halen ga dan naar LiteSpeed Cache > Pagina Optimalisatie, alles standaard behalve:
[1] CSS instellingen:
CSS Minify > Aan (Goed testen op eventuele conflicten anders uit.)
Inline CSS Minify > Aan (Goed testen op eventuele conflicten anders uit.)
CSS Combine > Aan (Goed testen op eventuele conflicten anders uit.)
CSS HTTP/2 Push > Aan
[2] JS instellingen
JS Minify > Aan (Goed testen op eventuele conflicten anders uit.)
Inline JS Minify > Aan (Goed testen op eventuele conflicten anders uit.)
JS Combine > Aan (Goed testen op eventuele conflicten anders uit.)
JS HTTP/2 Push > Aan
[3] Optimalisatie instellingen
HTML Minify > Aan (Goed testen op eventuele conflicten anders uit.)
Remove Comments > Aan (Goed testen op eventuele conflicten anders uit.)
Remove Query Strings > Aan
Remove WordPress Emoji > Aan
LiteSpeed Cache > [7] Browser:
Browser Cache > Aan
Let op: De minify/combine hangt erg af van welk theme / plugins je gebruikt en of deze goed zijn geprogrammeerd. Het is met iedere optie even testen of dat goed werkt en anders uitzetten. De object caching kan je het best uitlaten. Wij zien maar weinig gevallen waarbij dit echt snelheid toevoegt en hiervoor moet je een aparte service afnemen.
- Voer nu opnieuw de benchmark uit en bekijk of de “Time to First Byte” (TTFB) sneller is geworden. LiteSpeed zorgt met name voor een optimalisatie in de TTFB.
- Laad nu de pagina de eerste keer in je Incognito window, dit zal wat langer duren aangezien alle cache nu geleegd is. Test of alle JS en CSS naar behoren werkt na het Minifyen.
- Voer alle benchmark tests nu nog een keer uit en bekijk het verschil in snelheid.
- Als alles is doorgelopen is de optimalisatie afgerond!
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):
Heb je maar een of enkele pagina’s gewijzigd in een website met veel pagina’s, dan is het efficiënter om de betreffende pagina te flushen. Ga in je dashboard naar de site, dan naar de betreffende pagina en klik bovenin op het LiteSpeed ikoon en kies Schoon de pagina op (Purge this page):
In geval de website in ontwikkeling is
Het beste kun je dan in de bouw-momenten de caching even uitzetten en legen, of een uitzondering toevoegen in de instellingen voor bijvoorbeeld administrators:
LiteSpeed > Cache > [4] Uitsluiten > Niet cachen regels > Administrators aanvinken en klik Wijzigingen opslaan.