We zijn altijd op zoek naar nieuwe en innovatieve manieren om je sites nog sneller te maken en te optimaliseren. Zoals je misschien al weet, zijn WP Rocket en Kinsta al een tijdje volledig compatibel.
Bekijk hieronder alles wat je moet weten over het gebruik van WP Rocket bij Kinsta en hoe het een uitstekende match kan zijn voor jou en je klanten.
WP Rocket gebruiken bij Kinsta
Voor degenen die niet bekend zijn met WP Rocket, het is een populaire alles-in-één premium prestatieplugin voor WordPress die in de eerste plaats caching biedt. Normaal gesproken staan we cachingplugins niet toe in onze omgeving omdat ze conflicteren met onze ingebouwde caching oplossing.
De WP Rocket functionaliteit voor het cachen van pagina’s wordt echter automatisch uitgeschakeld als de plugin wordt uitgevoerd op servers van Kinsta. Als gevolg hiervan staan we WP Rocket toe op ons platform omdat er geen incompatibiliteiten meer zijn.
Hierdoor kun je de cachingoplossing van Kinsta gebruiken, maar toch profiteren van de geweldige optimalisatiefuncties van WP Rocket (waar we hieronder dieper op ingaan).
Waarom is caching belangrijk? Caching is het proces van het opslaan van bronnen van één verzoek en het hergebruiken van die bronnen voor volgende verzoeken. In principe vermindert het de hoeveelheid werk die nodig is om een paginaweergave te genereren en vermindert het de belasting op de webserver. Het is de belangrijkste manier om de vertraging als gevolg van de afhankelijkheid van WordPress van PHP en een database op te heffen (lees meer over WordPress vs statische HTML).
WP Rocket features
WP Rocket is een krachtige en eenvoudig te gebruiken plugin – de gebruikersinterface is prachtig en toch eenvoudig te gebruiken en te navigeren! Hieronder duiken we in een paar van de aanbevolen features die je kunt gebruiken van WP Rocket om je WordPress site te versnellen en hoe deze is gesynchroniseerd met de Kinsta omgeving.
We zullen ook een aantal snelheidstests uitvoeren om te zien welke opties de meeste impact hebben op een live site. Onthoud dat de resultaten van site tot site kunnen verschillen, dus zorg ervoor dat je op je eigen site of testsite test.
Als je een testsite bij Kinsta gebruikt, heeft WP Rocket onze URL-structuur (staging-sitenaam.kinsta.cloud) op een witte lijst gezet, wat betekent dat deze niet meetelt als site voor je totale licentietelling. Hetzelfde geldt voor het draaien op localhost.
Cache wissen
Hoewel caching automatisch wordt uitgeschakeld in WP Rocket wanneer het draait op Kinsta, wordt de optie “Clear and preload cache” in het menu van WP Rocket gesynchroniseerd met de Kinsta omgeving. Als je de cache van WP Rocket wist, wordt in plaats daarvan de Kinsta cache van je hele site gewist. Hoe cool is dat? Zoals altijd kun je je Kinsta cache wissen via de rechterbovenhoek van de beheerbalk.
Wanneer je een plugin activeert of deactiveert, vraagt WP Rocket je om de cache te wissen. Dit is alleen aan te raden als de plugin frontend content toevoegt, zoals een cookie banner plugin.
Als laatste kun je op de knop “Clear and Preload cache” klikken in het dashboard van WP Rocket om ook de Kinsta cache te wissen.
Cache
Zoals we al eerder zeiden, is de pagina-caching van WP Rocket automatisch uitgeschakeld voor sites die worden gehost op Kinsta. Daarom raden we je aan om de cache-instellingen van WP Rocket te laten zoals ze zijn met “Enable Caching for Mobile Devices” – wat de standaardoptie is die wordt meegeleverd met WP Rocket 3.16.
Bestandsoptimalisatie
In het menu “File Optimization” geeft WP Rocket je de mogelijkheid om je CSS- en JavaScript-bestanden te optimaliseren. Laten we eens in elk van deze bestanden duiken.
CSS-bestanden
- Het minificeren van CSS-bestanden verwijdert witruimte en commentaar om de bestandsgrootte te verkleinen. Met deze optie ingeschakeld hebben we snelheidstests uitgevoerd en zagen we een daling van 0,87% in laadtijd. vanwege de manier waarop CSS werkt, kan dit je site breken, dus zorg ervoor dat je het test. Nogmaals, over het algemeen is minder witruimte en code een goede zaak.
- CSS delivery optimaliseren elimineert render-blocking CSS op je website voor een sneller waargenomen laadtijd. We raden aan om de feature Remove unused CSS in te schakelen.
Lees hier meer over in onze diepgaande artikelen over render-blocking CSS en het optimaliseren van het kritieke renderpad. Met deze optie ingeschakeld hebben we snelheidstests uitgevoerd en zagen we een 56,36% kortere laadtijd. onthoud wel dat het hier meer gaat om de waargenomen laadtijd dan om de werkelijke laadtijd.
JavaScript bestanden
- Het minificeren van JavaScript-bestanden verwijderen witruimte en commentaar om de bestandsgrootte te verkleinen. In de test die we uitvoerden, had deze functie een lage impact, omdat er weinig was dat niet eerder was geminimaliseerd door de ontwikkelaars van de paginabouwer. Door de manier waarop JavaScript werkt, kan dit echter functionaliteit met je plugins of thema verbreken, dus zorg ervoor dat je het test.
- Uitgesteld JavaScript laden elimineert render-blocking JS op je site en kan de laadtijd verbeteren. Lees hier meer over in onze diepgaande artikelen over render-blocking JavaScript. Als je niet voorzichtig bent, kan dit echter ook je site breken, dus zorg ervoor dat je het test.
- Vertraging van JavaScript-uitvoering verbetert de prestaties door het laden van JavaScript-bestanden uit te stellen tot de eerste interactie van de gebruiker, zoals scrollen en klikken. Met deze optie ingeschakeld hebben we snelheidstests uitgevoerd en zagen we een daling van 33,33% in laadtijd.
Zoals je misschien al hebt gemerkt, is de invloed van features met betrekking tot minificatie op de prestaties klein. Dit komt omdat de meeste thema’s en plugins tegenwoordig geminificeerde CSS en JavaScript toevoegen, en gerelateerde features leveren meestal weinig tot geen verandering op in de prestaties, tenzij het thema of de plugin vreselijk gecodeerd is met een totale minachting voor prestaties, wat uiterst zeldzaam is. Andere technieken, zoals het verwijderen van ongebruikte CSS en het uitstellen en vertragen van JavaScript, maken een verschil in codeoptimalisatie.
Media
Onder het menu “Media” kun je je afbeeldingen, video’s en frames lazyloaden. Je hebt ook de mogelijkheid om CSS achtergrondafbeeldingen te lazyloaden en ontbrekende afbeeldingsafmetingen toe te voegen.
Laten we eens in elk van deze opties duiken.
Lazyloading
Lazyloading is een optimalisatietechniek die zichtbare inhoud laadt, maar het downloaden en renderen van inhoud die verder onder de pagina moet laden (below the fold), uitstelt. Het inschakelen van de optie voor lazyloaden kan de werkelijke en waargenomen laadtijd verbeteren, omdat afbeeldingen, iframes en video’s pas worden geladen als ze de viewport binnenkomen (of op het punt staan binnen te komen), waardoor het aantal HTTP-verzoeken wordt verminderd.
- Inschakelen voor afbeeldingen: Met deze optie ingeschakeld hebben we snelheidstests uitgevoerd en zagen we een daling van 8,55% in laadtijd. De impact van zo’n feature is beperkt omdat WordPress core tegenwoordig van zichzelf lazyload toevoegt aan alle afbeeldingen. De lichte verbetering in de test kwam van optimalisatie van achtergrondafbeeldingen.
- Inschakelen voor iframes en video’s: WP Rocket heeft een optie om een YouTube video automatisch te vervangen door zijn thumbnailafbeelding. Dit is een krachtige optie om de impact van YouTube-gerelateerde bestanden en zware scripts te verminderen, die zowel de laadsnelheid als de webvitale prestaties van de pagina beïnvloeden.
Bekijk onze uitgebreide tutorial over lazyloading in WordPress.
Preload
Onder het menu “Preload” geven ze je de optie om cache preload, preload links, DNS prefetch en preload fonts in te schakelen. Niet al deze opties werken bij Kinsta. Maar laten we eens in elk van deze opties duiken.
Cache preloaden
We raden deze optie niet aan voor sites die worden gehost op Kinsta, omdat het de prestaties kan verminderen door PHP threads te overbelasten.
Preconnecten met externe domeinen
Vanaf WP Rocket 3.19 is de oude feature Prefetch DNS Requests verwijderd en vervangen door een geautomatiseerde functie Preconnect to External Domains.
Preconnecting helpt het laden te versnellen door browsers netwerkverbindingen (DNS, TLS, TCP) met externe domeinen te laten opzetten voordat ze daadwerkelijk nodig zijn. Dit is vooral handig voor externe bronnen die invloed hebben op Largest Contentful Paint (LCP), zoals analytische scripts of Google Fonts.
In tegenstelling tot de vorige handmatige methode die gebruik maakte van <link rel="dns-prefetch"> in de <head> van je site, is de nieuwe feature volledig automatisch (geen setup of handmatige invoer nodig). WP Rocket detecteert nu welke externe domeinen nodig zijn op elke pagina en injecteert dienovereenkomstig preconnect hints.
Deze verandering maakt de optimalisatie nauwkeuriger en neemt het risico van onnodige of onjuiste configuraties weg. Je ziet deze instelling niet meer in de interface van WP Rocket, maar hij is standaard actief.
Lettertypes preloaden
Als je lettertypen host op je eigen domein en niet op een externe service zoals Google Fonts, raden we je aan om ze toe te voegen aan de “Preload Fonts” lijst in WP Rocket. Door lettertypen vooraf te laden in je HTML’s head element, kunnen webbrowsers lettertypen downloaden voordat ze worden gevonden in je CSS bestand.
Geavanceerde regels
Omdat WP Rocket synchroniseert met de Kinsta omgevingscache, kun je de geavanceerde regels niet gebruiken. Als je een URL of map wilt uitsluiten van caching of een bepaalde querystring geforceerd wilt cachen, kun je altijd contact opnemen met het Kinsta supportteam.
Database
In het menu “Database” kun je met WP Rocket opruimacties uitvoeren voor berichten, reacties, transients en tabellen.
In combinatie met onze automatische wekelijkse databaseoptimalisaties, kun je door je database schoon te houden door onnodige postrevisies en transients te verwijderen, ervoor zorgen dat je database optimaal presteert.
Berichten opschonen
Het is niet ongewoon dat oudere sites 100+ revisies op hun belangrijkste pagina’s hebben. Dit is simpelweg het gevolg van jarenlang bewerken en bijwerken van inhoud. Laten we bijvoorbeeld zeggen dat een site 700 pagina’s of berichten heeft met 150 revisies op elke pagina. Dit zou neerkomen op meer dan 100.000 vermeldingen in de database. Dit neemt opslagruimte in beslag en zelfs met database-indexen kan dit de prestaties soms in de weg zitten.
WP Rocket geeft je de optie om het volgende te verwijderen:
- Revisies
- Auto-ontwerpen
- Vernietigde berichten
Bekijk onze uitgebreide post over hoe je revisies kunt optimaliseren voor snellere prestaties.
Comments opschonen
Net als bij revisies kunnen spam en weggegooide reacties na verloop van tijd voor extra ruimteverspilling zorgen. WP Rocket geeft je de optie om het volgende te verwijderen:
- Spam opmerkingen
- Overbodige opmerkingen
Als je geen reacties gebruikt op je WordPress site raden we je aan om reacties gewoon uit te schakelen om te voorkomen dat er überhaupt spam doorheen komt. Je hoeft je dan ook geen zorgen te maken over het installeren van spam plugins.
Transients opschonen
Transients in WordPress worden soms over het hoofd gezien, maar ze zijn heel belangrijk! We hebben zelfs meegemaakt dat een beschadigde transient in de cache een WordPress site volledig platlegde. Deze zijn bedoeld als tijdelijk en dus is het veilig om ze te verwijderen en we raden het dan ook aan. Als een plugin ze nodig heeft, worden ze automatisch geregenereerd. WP Rocket geeft je de optie om alle transients te verwijderen.
Database opschonen
De optie database opschonen vermindert de overhead van databasetabellen. Bij Kinsta gebruiken we echter InnoDB in plaats van MyISAM en daarom is dit meestal niet nodig. Het is aangetoond dat InnoDB beter presteert en betrouwbaarder is. Een belangrijke reden om InnoDB te gebruiken in plaats van MyISAM is om te profiteren van vergrendeling op rijniveau. Hierdoor kunnen je database queries sneller verwerkt worden. Als je je WordPress site migreert naar Kinsta, is dit een van de vele optimalisaties die onze engineers op je site uitvoeren.
Automatisch opschonen
WP Rocket geeft je ook de optie om een automatische opschoning van je database in te plannen op dagelijkse, wekelijkse of maandelijkse basis. Dit wordt gepland met een cron job achter de schermen.
CDN
Onder het menu “CDN” kun je een extern content delivery netwerk inschakelen. Dit is echt een no-brainer als het gaat om prestaties. Ze ontlasten je webserver en versnellen de levering van inhoud aan je bezoekers, waardoor hun ervaring beter wordt. Lees waarom wij vinden dat elke site een CDN zou moeten gebruiken.
Als je een klant van Kinsta bent, heb je dit menu niet nodig omdat het Kinsta CDN achter de schermen automatisch op je site wordt geïnstalleerd.
We raden aan om je WordPress site eerst door een website snelheidstest tool te halen om te controleren of al je assets (JS, CSS en afbeeldingen) worden geladen vanaf het Kinsta CDN.
Heartbeat
Heartbeat is een WordPress Core API voor server-polling. Het wordt door veel thema’s en plugins gebruikt om een verbindingsflow met je server te onderhouden. Hierdoor kunnen WordPress ontwikkelaars real-time updates in hun producten inbouwen.
Standaard wordt de Heartbeat code aan de clientzijde elke 15-60 seconden uitgevoerd. Afhankelijk van je site en serverconfiguratie zijn frequente Heartbeat serverpings misschien niet nodig.
Met WP Rocket kun je de Heartbeat ping intervallen verminderen tot 2 minuten of pings helemaal uitschakelen voor de backend (WP dashboard), frontend en bericht-editor van je site.
Voor de meeste sites raden we aan om de optie “Reduce Activity” te gebruiken. Veel moderne plugins en thema’s vertrouwen op Heartbeat voor core-features, dus het volledig uitschakelen kan je site beschadigen.
Add-ons
Onder “Add-Ons” geeft WP Rocket je de mogelijkheid om extra diensten aan je site toe te voegen, zoals Cloudflare, Sucuri, Google Analytics en Facebook Pixel. Als je een van deze diensten op je site gebruikt, raden we je aan om ze via WP Rocket in te stellen om er zeker van te zijn dat je profiteert van de meest optimale integratie voor deze diensten.
Als je al andere plugins gebruikt om deze services in je site te integreren, kun je deze plugins veilig verwijderen nadat je de add-on in WP Rocket hebt geconfigureerd.
Afbeelding optimalisatie
De ontwikkelaars van WP Rocket zijn dezelfde mensen achter Imagify, een van onze favoriete services voor afbeeldingsoptimalisatie. Als je op zoek bent naar een gebruiksvriendelijke WordPress plugin voor het optimaliseren van afbeeldingen, kijk dan eens naar Imagify. Klik hier voor meer informatie over afbeeldoptimalisatie en andere optimalisatieplugins en -oplossingen.
Laatste snelheidstesten
Vervolgens hebben we nog wat laatste snelheidstests uitgevoerd met alles ingeschakeld, zodat je een voor- en een nabeschouwing kunt zien. Opmerking: Deze WordPress site wordt gehost bij Kinsta.
Vóór WP Rocket
We hebben vijf tests uitgevoerd in PageSpeed Insights zonder WP Rocket.
Na WP Rocket
We hebben een nieuwe test uitgevoerd in Google PageSpeed Insights met WP Rocket.
We hebben ook een PageSpeed Insights test uitgevoerd met edge cache geactiveerd op Kinsta. We zagen dat de initiële serverresponstijd verbeterde van ~370 ms zonder edge cache naar 30 ms. Dat is handig als je levert aan een publiek uit meerdere geografische zones.
Hier is de conclusie van bovenstaande resultaten:
- WP Rocket gaat verder dan caching-opties en biedt krachtige features om CSS- en JS-bestanden, afbeeldingen en meer te optimaliseren.
- De site die we gebruikten voor de test is al redelijk geoptimaliseerd. Er is echter nog wel wat fine-tuning nodig om resultaten te garanderen en te voldoen aan Core Web Vitals.
- Als je YouTube video’s gebruikt, kun je laadtijddalingen tot 50% of meer zien. Dit wordt bereikt door gebruik te maken van de feature van WP Rockets die YouTube- video’s vervangt door klikbare thumbnails. Deze is echt héél handig!
- In onze Google PageSpeed Insights tests zagen we een stijging van onze score van 69/100 naar 100/100. Hoewel scores niet zo belangrijk zijn als algehele laadtijden -we bespreken dit in ons artikel over Google PageSpeed Insights-, maken Core Web Vitals deel uit van de nieuwste SEO ranking factor en we zagen ook een grote verbetering in hun cijfers.
Zoals je hierboven kunt zien, maakt WP Rocket het ongelooflijk eenvoudig om je WordPress site te versnellen met slechts een paar eenvoudige klikken!
Samenvatting
Het team van WP Rocket brengt consequent nieuwe functies uit die direct aansluiten bij de aanbevelingen voor webprestaties die we delen bij Kinsta. We zijn blij dat klanten deze plugin nu kunnen gebruiken zonder extra aanpassingen.
Brian heeft een enorme passie voor WordPress, gebruikt het al meer dan tien jaar en heeft zelfs al aantal premium plugins ontwikkeld. Brian houdt van bloggen, films en hikes. Kom in contact met Brian op Twitter.
