Bij Kinsta zijn we altijd op zoek naar nieuwe en innovatieve manieren om jouw WordPress-sites sneller te maken en te optimaliseren. In de afgelopen maanden heeft ons team achter de schermen intensief samengewerkt met de developers van WP Rocket om enkele veranderingen te coördineren met de nieuwe versie 3.0 van hun plug-in (uitgebracht op 3 april 2019). We zijn daarom bijzonder verheugd om aan te kondigen dat WP Rocket 3.0 en Kinsta nu volledige compatibel zijn en dit ook altijd zullen blijven.

Lees hieronder alles wat je moet weten over hoe je WP Rocket binnen Kinsta kan gebruiken en hoe je deze plug-in in kan zetten voor jou en je klanten.

WP Rocket gebruiken binnen Kinsta

Mocht je nog niet bekend zijn met WP Rocket: dit is een populaire alles-in-één premium caching- en optimalisatieplug-in voor WordPress. Normaal gesproken staan we geen caching-plug-ins toe, omdat deze conflicten opleveren met onze ingebouwde caching-oplossing. Met ingang van WP Rocket versie 3.0, wordt hun pagina-caching-functionaliteit echter automatisch uitgeschakeld wanneer ze op Kinsta-servers worden uitgevoerd. Eerder moest dit handmatig worden gedaan met hun pagina-cachingmodule. We hebben de plug-in dan ook verwijderd uit onze lijst met verboden plug-ins.

Dit stelt je in staat om Kinsta’s cachingoplossing te gebruiken, maar tegelijkertijd ook te profiteren van de optimalisatiefeatures van WP Rocket (we behandelen deze hieronder).

Waarom is caching belangrijk? Caching is het proces waarbij bronnen van een aanvraag worden opgeslagen, zodat deze later opnieuw gebruikt kunnen worden voor volgende aanvragen. Simpel gezegd vermindert caching de hoeveelheid werk die nodig is om een pagina weer te geven, wat dus de belasting op je server verlaagt. WordPress staat erom bekend dat ze een redelijke aanslag doen op PHP en databases en het instellen van caching is de #1-methode om dit te verminderen (lees meer over WordPress vs statische HTML).

Features van WP Rocket 3.0

Als je de nieuwe 3.0-versie van WP Rocket nog niet hebt gezien: de gebruikersinterface is prachtig, terwijl de plug-in nog steeds gemakkelijk te gebruiken en te navigeren is! Hieronder behandelen we een aantal features van WP Rocket die we in het bijzonder aanraden om je WordPress-site te versnellen en leggen we uit hoe deze zijn gesynchroniseerd met de Kinsta-omgeving.

We voeren ook een aantal snelheidstests uit om te zien welke opties de meeste impact hebben op een live site. Vergeet echter niet dat de resultaten kunnen variëren van site tot site, dus zorg er ook zeker voor dat je op je eigen site tests uitvoert (live of in de testomgeving) Als je gebruik maakt van een testomgeving binnen Kinsta, dan zet WP Rocket deze automatisch op de witte lijst (staging-sitenaam.kinsta.com), wat betekent dat deze niet meetelt voor het aantal licenties. Hetzelfde geldt als je werkt op localhost.

Gebruikersinterface WP Rocket

Gebruikersinterface WP Rocket

Cache wissen

Hoewel caching automatisch wordt uitgeschakeld als WP Rocket zich binnen een Kinsta-omgeving bevindt, is de optie “Cache wissen” in het WP Rocket-menu gesynchroniseerd met de Kinsta-omgeving. Als je de cache van WP Rocket wist, dan leeg je in plaats daarvan de Kinsta-cache van je hele site. Hoe cool is dat? En natuurlijk kan je zoals altijd in de rechterbovenhoek van de adminbalk de Kinsta-cache legen.

Cache legen (2 manieren)

Cache legen (2 manieren)

De ‘Purge deze URL’ werkt ongeveer hetzelfde, maar in plaats van het wissen van de cache van de hele site, leegt de plug-in nu alleen de cache van de URL waar je je bevindt. Dit is vooral handig als je net handmatig een artikel of pagina hebt bijgewerkt. Om prestatieredenen raden we af om voortdurend de hele cache van je site te legen, omdat deze dan opnieuw moet worden opgebouwd. Het wissen van afzonderlijke URL’s is een veel betere methode.

WP Rocket cache legen voor afzonderlijke URL's

WP Rocket cache legen voor afzonderlijke URL’s

Als je een wijziging aanbrengt aan je WordPress-site, zoals een plug-in of thema, dan zie waarschijnlijk een waarschuwing van WP Rocket. Ook hier houdt het legen van de cache in dat je de Kinsta-cache leegt.

WP Rocket verandert het wijzigen van cache

WP Rocket verandert het wijzigen van cache

Als laatste, wanneer je op de ‘Clear Cache’-knop drukt in het WP Rocket dashboard, leegt dit ook de Kinsta-cache.

WP Rocket verwijder alle cached bestanden

WP Rocket verwijder alle cached bestanden

Bestandsoptimalisatie

In het Bestandsoptimalisatie-menu geven ze je de mogelijkheid om je CSS en JavaScript-bestanden te optimaliseren. Laten we hier eens in duiken.

WP Rocket bestandsoptimalisatie

WP Rocket bestandsoptimalisatie

Basisinstellingen

  • Minificeren HTML: ‘Minify HTML’ verwijdert witruimte en comments om de grootte te reduceren. We hebben speedstests uitgevoerd en zagen een vermindering van 0,84% in laadtijd wanneer deze optie ingeschakeld was. ⏱ Je ziet misschien geen overdreven verbeteringen met deze feature, maar doorgaans is minder witruimte en code iets goeds.
  • Combineer Google Fonts-bestanden: Het combineren van Google Fonts zal het aantal HTPP-verzoeken reduceren. Indien je een host gebruikt met HTTP/2 ingeschakeld, is het niet langer aangeraden om de bestanden te combineren als gevolg van verbeteringen met parallellisatie. HTTP/2 wordt volledig ondersteund door Kinsta. Het laden van fonts vanaf je eigen CDN kan soms ook de prestaties verbeteren. Check hiervoor onze gids: hoe host je fonts lokaal.
  • Queryreeksen uit statische bronnen verwijderen:Jouw CSS en JavaScript-bestanden hebben de bestandsversie meestal aan het einde van hun URLs, zoals domain.com/style.css?ver=4.6. Sommige servers en proxyservers zijn niet in staat om queryreeksen te cachen, zelfs als een header met cache-control:public  aanwezig is. Dus door ze te verwijderen, kun je je caching soms verbeteren. We hebben speedtests uitgevoerd en zagen een daling van 1,86% in laadtijd wanneer deze optie ingeschakeld was. ⏱ Lees meer over hoe queryreeksen werken. Opmerking: Je kunt dit gebruiken samen met de Minify CSS of JavaScript-opties.

CSS-bestanden

  • Minificeren van CSS-bestanden:‘Minify CSS’ verwijdert witruimte en comments om de bestandsgrootte te reduceren. We hebben speedtests uitgevoerd en zagen een verlaging van 1,69% in laadtijd met deze optie ingeschakeld. ⏱ Door de manier waarop CSS werkt, kan dit je site onbereikbaar maken, dus zorg dat je deze functie goed test. Nogmaals, in het algemeen is minder witruimte en comments iets positief.
  • Combineren van CSS-bestanden:‘Combine CSS’ voegt al je bestanden samen tot 1 bestand, waardoor het aantal HTTP-verzoeken vermindert. Als je gebruik maakt van een host met HTTP/2 ingeschakeld, is het niet langer aan te raden om bestanden te combineren, aangezien ze nu parallel kunnen laden via één enkele connectie. Kinsta ondersteunt HTTP/2 volledig. Lees meer over het combineren van externe CSS.
  • Optimaliseren CSS-levering:‘Optimize CSS delivery’ elimineert render-blocking CSS op je website voor een snellere waargenomen laadtijd. Lees hier meer over in onze uitgebreide artikelen over render-blocking CSS en het optimaliseren van het kritische rendering pad. We hebben speedstests uitgevoerd en zagen een afname van 0,17% in laadtijd met deze optie ingeschakeld. ⏱ Vergeet overigens niet dat dit gaat over de waargenomen laadtijd en niet de werkelijke laadtijd.>

JavaScript-bestanden

  • Minificeren JavaScript-bestanden: ‘Minify JavaScript’ verwijdert witruimte en comments om de bestandsgrootte te reduceren. We hebben speedstests uitgevoerd en constateerden een afname van 0,84% in laadtijd met deze optie ingeschakeld. ⏱ (Ingeschakeld, Uitgeschakeld) Vanwege de manier waarop JavaScript werkt, kan dit de functionaliteit van je plug-ins of thema’s schaden, dus zorg dat je deze functionaliteit van tevoren test. En nogmaals, doorgaans zijn minder witruimte en code iets positiefs.
  • Combineren JavaScript-bestanden:‘Combine Javascript files’ combineert je sites JS naar minder bestanden en reduceert daarmee het aantal HTTP-verzoeken. Als je gebruikmaakt van een ingeschakelde HTTP/2-host, wordt het niet meer aangeraden om bestanden te combineren, omdat ze nu parallel kunnen laden via één enkele connectie. HTTP/2 wordt volledig ondersteund door Kinsta.
  • Uitgesteld laden van JavaScript: ‘Load JavaScript deferred’ elimineert render-blocking JS op je site en kan de laadtijd verbeteren. Lees hier meer over in onze uitgebreide artikelen over render-blocking JavaScript. Dit kan je site ook breken als je niet voorzichtig bent, dus zorg dat je dit test. We hebben speedtests uitgevoerd en zagen een daling van 1,35% in laadtijd met deze optie ingeschakeld. ⏱

Media

In het menu Media geeft de plug-in je een optie om je afbeeldingen en video te ‘lazyloaden’ evenals het uitschakelen van het laden van extra scripts, zoals Emojis en Embeds. Laten we hier dieper op ingaan.

WP Rocket media-optimalisatie

WP Rocket media-optimalisatie

LazyLoad

Lazyloading is een optimalisatietechniek die zichtbare content laadt, maar het downloaden en renderen van content die verschijnt bij het scrollen, vertraagt. Door de lazyload-optie in te schakelen kan de werkelijke en waargenomen laadtijd verbeteren, aangezien afbeeldingen, iframes en videos alleen geladen worden wanneer zij de viewport (bijna) binnenkomen – dit reduceert het aantal HTTP-verzoeken.

  • Inschakelen voor afbeeldingen:We hebben speedtests uitgevoerd en zagen een afname van 3,89% in laadtijd met deze optie ingeschakeld. ⏱
  • Inschakelen voor iframes en videos:We hebben acht YouTube-videos op een pagina geplaatst en we zagen een afname van 74,43% in laadtijd wanneer deze optie was ingeschakeld. ⏱ WP Rocket heeft een optie om een YouTube-video automatisch te vervangen met hun preview-afbeelding. Dit is een ongelooflijk goede manier om videos meer snelheid te geven op je WordPress-site.

Check onze uitgebreide tutorial over lazyloading in WordPress.

Emoji

Met de release van WordPress 4.2 kwam de integratie van emoijs in de kern van oudere browsers. Het grote probleem is dat dit een extra HTTP-verzoek genereert op je WordPress-site om eenwp-emoji-release.min.js -bestand te laden. En dit verzoek laadt op iedere pagina.

Uitschakelen Emoji:De disable emoji-optie zal het aantal HTTP-verzoeken reduceren. De emoji’s zullen nog wel werken, maar met deze functie ingeschakeld worden weer de emoji-versies van de browser van de bezoeker worden geladen. We hebben speedtests gerund en zagen een afname van 2,2% in laadtijd met deze optie ingeschakeld.⏱ Check ons uitgebreide artikel over het uitschakelen van emoji’s.

Insluitingen

De release van WordPress 4.4 bracht de oEmbed-feature naar de WordPress-kern. Je hebt deze feature waarschijnlijk al wel eerder gezien of gebruikt. Dit staat gebruikers toe om YouTube-videos, tweets en andere bronnen in te sluiten op hun website door simpelweg een URL te plakken, die WordPress automatisch omzet in een insluiting en voorziet van een live preview in de visuele editor.

Je raadt het al, ook deze functie genereert een extra HTTP-verzoek op jouw WordPress-site om hetwp-embed.min.js  -bestand te laden. En deze laadt op iedere afzonderlijke pagina.

Uitschakelen WordPress-insluitingen: De disable embeds-optie zal het aantal HTTP-verzoeken reduceren. We hebben speedstests uitgevoerd en constateerden een afname van 4,9% in laadtijd met deze optie ingeschakeld. ⏱ Check ons uitgebreide artikel over het uitschakelen van insluitingen.

Preload

Onder het Preload-menu geeft WP Rocket je de optie om sitemap preloading, preload bots en prefetch DNS-verzoeken in te schakelen. Deze zullen niet allemaal werken bij Kinsta. Laten we er eens wat dieper op ingaan.

WP Rocket Preload

WP Rocket Preload

Sitemap Preloading en Preload Bot

We raden aan om geen van deze opties te gebruiken en in feite, ze zullen hoogstwaarschijnlijk niet werken in Kinsta.

Prefetch DNS-verzoeken

DNS-prefetching staat je toe om domeinnamen om te zetten (het uitvoeren van een DNS-lookup op de achtergrond) voordat een gebruiker op een link klikt, wat vervolgens kan helpen de prestatie te verbeteren. Dit wordt gedaan door een<rel="dns-prefetch" -tag toe te voegen in de header van je WordPress-site. We raden aan om prefetch toe te voegen aan externe verzoeken van je CDN, Google Fonts en Google Analytics. Hieronder een voorbeeld:

<link rel="dns-prefetch" href="//cdn.domain.com/">
<link rel="dns-prefetch" href="//fonts.googleapis.com/">
<link rel="dns-prefetch" href="//www.google-analytics.com">

Het is lastig om hier een speedtest op uit te voeren, maar je kunt ervan verzekerd zijn dat dit de snelheid van je site versnelt.

Geavanceerde regels

Vanwege het feit dat WP Rocket synchroniseert met de Kinsta-omgevingscache, kun je de uitgebreide regels niet gebruiken. Als je een URL of directory moet uitsluiten van caching kun je altijd contact opnemen met het Kinsta-ondersteuningsteam.

Database

In het menu Database geeft de plug-in je de mogelijkheid om schoonmaakacties uit te voeren op posts, comments, transients en tabellen.

WP Rocket Database

WP Rocket Database

Opschonen van artikelen

Het is niet ongebruikelijk voor oudere sites dat zij 100+ revisies op hun hoofdpagina hebben. Dit komt simpelweg door het editen en updaten van content door de jaren heen. Laten we bijvoorbeeld zeggen dat een site 700 pagina’s of posts heeft met ieder 150 revisies. Dit zijn meer dan 100.000 invoergegevens in de database. Dit neemt opslagruimte in beslag en dit kan zelfs met database-indexen de prestatie negatief beïnvloeden. WP Rocket geeft je de optie om het volgende te verwijderen:

  • Revisies
  • Auto-concepten
  • Verwijderde posts

Check onze uitgebreide post over hoe je revisies kunt optimaliseren voor snellere prestaties.

Opschonen van reacties

Net als revisies kunnen spam en verwijderde comments zich makkelijk opstapelen tot ongekende hoogtes – als je het maar genoeg tijd geeft. WP Rocket geeft je de optie om het volgende te verwijderen:

  • Spam comments
  • Verwijderde comments

Als je comments niet gebruikt op je WordPress-site raden we je aan om de comments uit te schakelen om te voorkomen dat spam überhaupt doorkomt. Dan hoef je jezelf ook geen zorgen te maken over het installeren van spam plug-ins.

Opruimen van tijdelijke bestanden

Er wordt in WordPress soms over tijdelijke bestanden (transients) heen gekeken, maar ze zijn ontzettend belangrijk! We hebben wel eens gezien hoe een beschadigde transientcache een WordPress-site compleet uit de lucht haalde. De bestanden zijn echt bedoeld als tijdelijke oplossing en daarom is het geen probleem om ze te verwijderen en we raden dat ook aan. Als ze benodigd zijn voor een plug-in worden ze automatisch gegenereerd. WP Rocket geeft je de optie om het volgende te verwijderen:

Downtime en WordPress problemen? Kinsta is de hosting oplossing speciaal ontworpen om jou tijd te besparen! Bekijk onze kenmerken
  • Verlopen transients
  • Alle transients

Opschonen database

Database-opschoning verlaagt de overhead van databasetabellen.  Echter, bij Kinsta maken we gebruik van InnoDB in plaats van MyISAM en daardoor is dit meestal niet nodig.InnoDB heeft aangetoond beter te presteren en betrouwbaarder te zijn. Een goede reden om InnoDB te verkiezen boven MyISAM is om voordeel te halen uit het vergrendelen van rijen. Dit zorgt ervoor dat je queries sneller verwerken. Als je je WordPress-site naar Kinsta migreert, is dit één van de optimalisaties die onze technici op je site uitvoeren.

Automatische opschoonhandelingen

WP Rocket geeft je ook de optie om de opruiming van je database automatisch in te stellen op dagelijkse, wekelijkse of maandelijkse basis. Dit wordt achter de schermen gepland met een CRON-taak.

CDN

In het CDN-menu kun je een extern leveringsnetwerk inschakelen om je content te leveren. Wat betreft het verbeteren van de prestaties van je site is dit een van de makkelijkste en meest voor de hand liggende dingen die je kan doen. Een CDN ontlast je webserver, terwijl ze de levering van content aan je bezoekers versnellen en hun ervaring dus verbeteren. Lees waarom wij denken dat elke site een CDN zou moeten gebruiken. 

Als je een Kinsta-klant bent, zal dit menu niet nodig zijn aangezien de Kinsta CDN automatisch achter de schermen wordt uitgerold op je website. Echter, we hebben op een aantal sites gemerkt dat het misschien nodig is om de URL van je Kinsta CDN op te geven wanneer WP Rocket is ingeschakeld. We raden je aan om je WordPress-site eerst door een website speedtest-tool te halen om te bevestigen dat al je assets (JS, CSS en afbeeldingen) worden geladen. Als dat niet zo is, probeer dan om je Kinsta CDN URL handmatig in te voeren (bijvoorbeeld: mk0dgs321g.kinstacdn.com).

WP Rocket CDN

WP Rocket CDN

Add-Ons

In het Add-Ons-menu geeft WP Rocket je de mogelijkheid om Cloudflare in te schakelen. Als je de WP Rocket Cloudflare add-on inschakelt, heb je de officiële Cloudflare plug-in niet meer nodig. WP Rocket voorziet namelijk in hetzelfde: het voorzien van oorspronkelijke IP-adressen.

WP Rocket invoegtoepassingen

WP Rocket invoegtoepassingen

Indien je WP Rocket gebruikt met een andere hostingprovider, zul je ook de optie hebben om Varnish in te schakelen. Echter, aangezien dit zal conflicteren met onze cache-oplossing hier bij Kinsta, is deze optie automatisch verborgen.

Definitieve speedtests ⏱

We hebben een aantal definitieve speedtests uitgevoerd met alles ingeschakeld, zodat je een vóór en ná kunt zien. Opmerking: deze WordPress-site wordt gehost door Kinsta.

Vóór WP Rocket

We hebben 5 tests in Pingdom uitgevoerd zonder WP Rocket en het gemiddelde genomen.

Vóór WP Rocket

Vóór WP Rocket

Daarna hebben we een test in Google PageSpeed Insights uitgevoerd zonder WP Rocket.

PageSpeed Insights vóór WP Rocket

Google PageSpeed Insights vóór WP Rocket

Na WP Rocket

We hebben toen 5 tests uitgevoerd in Pingdom met WP Rocket en ingeschakelde opties hiervan het gemiddelde van genomen.

Met WP Rocket

Met WP Rocket

We hebben daarna een test in Google PageSpeed Insights uitgevoerd met WP Rocket.

PageSpeed Insights met WP Rocket

Google PageSpeed Insights met WP Rocket

Hier is de conclusie van bovenstaande resultaten:

  • In onze Pingdom-tests zagen een afname van 9,12% in totale laadtijd tijdens het runnen van WP Rocket. Hoewel dit misschien niet uitermate hoog lijkt, duurde het slechts een paar minuten en minder dan 10 kliks om dit te bewerkstelligen.
  • Onthoud dat WP Rocket zijn boterham verdiend dankzij hun caching-oplossing. Hier bij Kinsta hebben we onze eigen ingebouwde cache, dus we delen alleen de resultaten van hun andere optimalisatie-features. In werkelijkheid is dit dus een verbetering van 9% bovenop Kinsta’s razendsnelle cache. ⚡
  • De site die we hebben gebruikt voor de test is al behoorlijk geoptimaliseerd. Grotere sites en sites die niet zo geoptimaliseerd zijn, zullen makkelijk nog grotere resultaten opleveren.
  • Benieuwd waarom er extra verzoeken zijn in de finale versie? Dit komt meestal door het lazyloading van de afbeeldingen omdat het blanco data:image/gif;base64 -verzoeken creëert. Maar geen zorgen, het zal nog steeds sneller zijn.
  • Als je videos host kun je mogelijk een afname in laadtijd zien vanaf 50% of meer. Dit wordt bereikt door gebruik te maken van WP Rockets feature die YouTube-videos met klikbare preview-thumbnails vervangt. Dit is superhandig!
  • In onze Google PageSpeed Insights-tests zagen we een toename in onze score van 88/100 tot 98/100. Echter, scores zijn niet zo belangrijk als de algehele laadtijden¸ dus neem deze met een korreltje zout. We discussiëren hierover in ons artikel over Google PageSpeed Insights.

Zoals je hierboven kunt zien, maakt WP Rocket het je ontzettend makkelijk om met een paar simpele clicks je site te versnellen.

Samenvatting

Het team van WP Rocket perst er constant nieuwe features uit die direct op elkaar afstemmen met de webprestatie-aanbevelingen die we bij Kinsta delen. Je kunt verwachten dat je nog een strakkere integratie zal zien met hun plug-in in de volgende maanden! Wij zijn in elk geval razend enthousiast dat onze klanten deze plug-in nu zonder problemen kunnen gebruiken!

We horen graag wat jij hierover denkt. Gebruik jij WP Rocket? Laat het ons weten onderaan in de reacties.


Als je dit artikel leuk vond, dan zul je gek zijn op Kinsta’s WordPress hosting platform. Of het nu gaat om het versnellen van jouw website of het krijgen van 24/7 support van ons ervaren WordPress-team. Onze door Google Cloud aangedreven infrastructuur is gericht op automatische schaalbaarheid, prestaties en beveiliging. Laat ons jou het Kinsta verschil tonen! Bekijk onze pakketten