De Perfmatters-plugin is een lichte maar krachtige tool onder de optimalisatieplugins voor WordPress. Je regelt er overbodige scripts en resources eenvoudig mee, zodat pagina's sneller laden en de server zo min mogelijk belast wordt. Na meer dan 5 jaar gebruik merk ik vooral dat het verder gaat dan alleen snelheidswinst: de hele site wordt er stabieler en makkelijker te beheren door.
Momenteel gebruik ik de plugin WP Rocket Cache samen met Perfmatters. In dit artikel deel ik voor Perfmatters op zichzelf de basisinstellingen en de reden achter elke keuze, en de optimalisatieresultaten.
Inhoud
8 min. leestijd
Inhoud
8 min. leestijd
View more
Ⅰ. De beste optimalisatieplugin voor WordPress
Cacheplugins voor WordPress zijn een onderwerp waar WordPress-gebruikers altijd op terugkomen. De meeste gebruikers zien na het installeren van een cacheplugin in Google PageSpeed en Chrome DevTools een mooie verbetering van de prestaties van hun website.
Maar als je een site beheert, voeg je allerlei plugins toe om de ervaring van bezoekers te verbeteren of functies uit te breiden. Het probleem is dat er daarbij steeds meer overbodige scripts en resources bijkomen, waardoor er vaak juist een tragere laadtijd van pagina's ontstaat.
Ik maakte precies hetzelfde mee met de plugin WP Rocket, en hoewel het aan mijn eigen beperkte ervaring en kennis kan liggen, kwam ik tot de conclusie dat een andere cacheplugin geen beter alternatief was.
1️⃣ Optimalisatieplugins vergeleken
Vergeleken met clearfy, Autoptimize en Asset CleanUp koos ik Perfmatters omdat het de meest intuïtieve gebruikersinterface had en bij elke instelling een uitgebreide uitleg gaf. Apart googelen was bijna nooit nodig.
PerfmattersMijn keuze
De meest intuïtieve gebruikersinterface, met een uitgebreide uitleg bij elke instelling.
Biedt dezelfde functies, maar is veel te ingewikkeld. Ik heb het 5 minuten na de installatie weer verwijderd.
TrustPilot geeft Perfmatters een hoge score van 4,9. Toen ik voor het eerst een optimalisatieplugin voor WordPress koos, gaf die score de doorslag voor Perfmatters.
2️⃣ Perfmatters-prijzen & kortingscode
Na meer dan 5 jaar Perfmatters krijg ik nu officieel een kortingscode van Perfmatters zelf.
Vul de code in bij [Enter a discount code] op de betaalpagina en je krijgt 20% korting.
Ⅱ. Gids voor de basisinstellingen van Perfmatters
In WordPress worden CSS- en JS-bestanden globaal geladen, waardoor de code ook verschijnt op pagina's die hem niet gebruiken en de site vaak trager wordt. Perfmatters biedt alle functies die een optimalisatieplugin voor WordPress moet hebben: code verwijderen, resources beheren en verzoeken beperken.
Zo pak je het probleem van ‘verspilde resources’, dat een cacheplugin alleen niet oplost, bij de kern aan, en krijg je uiteindelijk snellere pagina's en een lagere serverbelasting tegelijk.
We beginnen bij de algemene instellingen van Perfmatters en lopen de basisoptimalisatie van de database en de optimalisatie van assets door; de Script Manager stel je in door vanuit het beheerscherm naar de site te gaan. De tutorial start bij de algemene instellingen, de Script Manager komt later aan bod.
Tabbladen van het basisinstellingenscherm van Perfmatters
Perfmatters is een plugin puur voor optimalisatie, zonder cachefunctie. Alleen al de optimalisaties op het tabblad General kunnen de prestaties van je website flink verbeteren.
De standaard emojifunctie van WordPress laadt een apart JavaScript-bestand (wp-emoji-release.min.js), wat onnodige verzoeken oplevert; vink je dit aan, dan wordt dit script niet geladen.
Gewone emoji in berichten tekent de browser zelf, dus daar verandert niets. Maar als je emoji rechtstreeks in de header of footer hebt gezet, kunnen sommige thema's ze verkeerd weergeven.
Disable Dashicons
Dashicons waren het officiële icoonlettertype van WordPress, maar moderne thema's en plugins gebruiken eigen iconen of SVG, en Dashicons worden alleen nog in het beheerscherm gebruikt. Vink aan om ze uit te schakelen.
XML-RPC is kwetsbaar voor onder meer brute-force-aanvallen, dus vink aan om het uit te schakelen. Laat het alleen aan als je een plugin zoals JetPack gebruikt die XML-RPC nodig heeft.
Remove jQuery Migrate
Code die oude en nieuwe code met elkaar laat communiceren; in de praktijk heb je hem niet nodig, dus vink aan om hem te verwijderen.
Hide WP Version
Als je WordPress-versie zichtbaar is, zijn kwetsbaarheden makkelijker te vinden, dus vink aan om hem te verwijderen.
Remove RSD Link
RSD Link is alleen nodig voor clients of mobiele apps die via XML-RPC verbinden, dus vink aan om hem te verwijderen.
Remove Shortlink
Permalinks maken shortlinks overbodig, dus vink aan om ze te verwijderen.
Soort
Voorbeeld
Uitleg
Shortlink
[https://domain.com/?p=123]
Standaardlink op basis van de bericht-ID. De standaardvorm van oude WordPress-versies.
Permalink
[https://domain.com/post-name/]
Goed leesbaar voor mensen. Nu de standaard op de meeste sites.
Disable RSS Feeds
Lever je geen RSS-feeds aan andere sites, vink dit dan aan om ze uit te schakelen.
Remove RSS Feed Links
Verwijder de link alleen als Disable RSS Feeds is aangevinkt.
Disable Self Pingbacks
Een interne link van je eigen site naar je eigen site maakt Self Pingbacks aan, dus vink aan om ze uit te schakelen. Pingbacks als backlinks in de reacties helpen je SEO nauwelijks.
Disable REST API
De REST API is een communicatievenster waarlangs apps, websites, plugins en externe diensten gegevens uit WordPress uitwisselen in JSON-formaat.
Situatie
Uitleg
✅ REST API ingeschakeld
Externe apps of plugins die [https://domain.com/wp-json/wp/v2/posts] opvragen, krijgen de berichtenlijst van de blog als JSON
⚙️ Voorbeelden van gebruik van de REST API
Gebruikt als een mobiele app de berichtenlijst van WordPress ophaalt of als externe tools (bijv. Rank Math, Elementor) sitegegevens automatisch bijwerken
❌ Als de REST API is uitgeschakeld
Wie het adres hierboven opvraagt, krijgt geen gegevens: externe verzoeken worden geweigerd
Laat je hem openbaar, dan kan iedereen basisinformatie over de site ophalen; veel plugins, waaronder Rank Math, gebruiken de REST API alleen in de ingelogde beheeromgeving.
Het veiligst is daarom om hem alleen uit te schakelen voor niet-ingelogde gebruikers (uitgelogd); dat helpt vooral de beveiliging, minder de snelheid.
Beheer je de site alleen, kies dan [Disable for Non-Admins]; zijn er andere auteurs, kies dan [Disable When Logged Out].
Staat Disable REST API aan (Logged Out), dan kan er een fout optreden, ook als een AI zoals Claude toestemming voor de verbinding heeft gekregen.
Krijg je een fout tijdens het verbinden met Claude MCP, voeg dan de instelling hieronder toe als codesnippet.
Dit schakelt de REST API zelf niet uit; het verwijdert alleen de bijbehorende linkmetatags uit de paginaheader en beperkt zo onnodige verzoeken.
Disable Google Maps
Sommige thema's of plugins laden het Google Maps API-script automatisch, ook op pagina's zonder kaart; vink dit aan om dat script te blokkeren en externe verzoeken te beperken.
Heb je berichten met Google Maps, zet dan in [Exclude Locations] de bericht-ID's enz., zodat de kaart in die berichten niet wordt uitgeschakeld.
Het script voor de wachtwoordsterktemeter laadt normaal alleen bij registreren, wachtwoord wijzigen en profiel bewerken en verder nergens. Zet een thema of plugin een formulier zoals een login-pop-up op elke pagina, dan wordt [zxcvbn.min.js] op de hele site geladen.
/wp-includes/js/zxcvbn.min.js
/wp-admin/js/password-strength-meter.min.js
Vink aan om het uit te schakelen. In de praktijk zie je dit bestand bijna nooit.
Disable Comments
Gebruik je op je WordPress-site geen reacties, vink dit dan aan om de reactiefunctie uit te schakelen.
Add Blank Favicon
Een vers geïnstalleerde WordPress heeft geen bestand [/favicon.ico], waardoor prestatietests een 404-fout tonen; deze optie haalt die fout weg en is bedoeld voor thema- en pluginontwikkelaars. WordPress-sites die al een favicon hebben hebben hem niet nodig.
Remove Global Styles
Sinds WordPress 5.9 zet de core automatisch de inline CSS [global-styles-inline-css] in de [<head>]. Het gaat om 150–200 regels inline CSS voor FSE-thema's, maar bij klassieke thema's zoals Kadence en GeneratePress komt die er ook zonder FSE bij, waardoor de HTML groter wordt en FCP/LCP iets slechter.
In het scherm van 2.6.8 is de oude schakelaar [Separate Block Styles] vervangen door de keuzelijst [Block Style Behavior]. De standaardwaarde [Separate Styles Inline (Default)] laadt de stijlen per blok.
WordPress heeft voor elk blok (alinea, afbeelding, galerij, knop enz.) eigen CSS, en standaard wordt ook de CSS van ongebruikte blokken gebundeld in een globale stylesheet geladen. Splits je per blok, dan wordt alleen de CSS geladen van de blokken die op de pagina staan.
CSS-gebruik tot 17% lager
Op sommige sites met één pagina LCP ~30–50 ms beter
TBT (Total Blocking Time) daalt nauwelijks, maar het CSS-parsen wordt lichter
Soort
Werking
Resultaat bij laden
❌ Oud (standaard)
Alle blok-CSS in één keer laden
Veel overbodige CSS mee
Block Style Behavior
Alleen CSS laden van blokken die op de pagina staan
Iets meer CSS-bestanden, maar de totale CSS-grootte daalt
Sinds WordPress-core 6.2 wordt dit officieel ondersteund, dus thema's en plugins zoals Kadence, Spectra, GeneratePress geven geen problemen. Heeft een thema of plugin echter een eigen logica voor het laden van CSS of een FSE-structuur (rond theme.json), dan kunnen stijlen botsen.
Deze functie gebruikt het WordPress-corefilter [should_load_separate_core_block_assets]. Let op: de CSS wordt inline in de body gezet in plaats van in de head van de website. Daardoor kan de W3C-validator waarschuwingen geven.
Bron: documentatie van perfmatters
Type
Voorbeeld
Reden
❌ Thema's op basis van FSE
Twenty Twenty-Four, Blockbase enz.
Globale stijlen (theme.json) hangen van de CSS af
⚠️ Oudere builderthema's
Avada, WPBakery, Jupiter X enz.
Eigen CSS-structuur en core-CSS worden dubbel geladen
⚠️ Blokplugins op basis van verouderde CSS
Oude Ultimate Blocks, Stackable (oude versie) enz.
Gaat ervan uit dat de gedeelde blok-CSS globaal wordt geladen
Disable Heartbeat & Revisions
De WordPress-[Heartbeat] is een signaal dat controleert of server en website verbonden zijn; in het dashboard stuurt hij elke 15 seconden een POST-verzoek naar /wp-admin/admin-ajax.php. Sta hem alleen toe bij het bewerken van berichten en pagina's en zet de frequentie op 60 seconden om de server te ontlasten.
Heartbeat
Alleen berichten en pagina's toestaan
Laat je de berichtrevisies (Revisions) op de standaardwaarde staan, dan stapelen ze zich op in de database en wordt de site trager; sta er daarom maximaal 3 toe.
Het interval voor automatisch opslaan van berichten staat standaard op 1 minuut; hier zetten we het op 10 minuten.
Gebruikt het schrijven in het beheerscherm veel server-CPU, dan kunnen de pagina's voor bezoekers trager worden, welke cacheplugin je ook gebruikt. Zonder Perfmatters kun je deze instellingen ook rechtstreeks in wp-config.php vastleggen.
General › Login URL
1 / 2
Instelling
Check / Uncheck
Korte uitleg
Login URL instellen
Vervangt andere plugins die de login-URL verbergen
Login-URL instellen
Het WordPress-dashboard staat standaard op yourdomain.com/wp-admin, en dat is kwetsbaar. In plaats van een andere plugin die het dashboard verbergt, kun je deze functie van Perfmatters gebruiken.
JavaScript Defer zorgt ervoor dat JavaScript pas wordt uitgevoerd nadat het HTML-document is geparsed en het scherm is getoond: een functie die het laden uitstelt zodat de rendering niet wordt geblokkeerd. DOMContentLoaded treedt eerder op, wat FCP en LCP verbetert.
Include Inline Scripts
Deze optie stelt ook korte JavaScript uit die rechtstreeks in het HTML-document staat (<script>…</script>). Inline scripts zijn vaak nodig voor eerste acties zoals een menu-toggle, dus laat je deze optie uit, tenzij je een speciale reden hebt.
Include jQuery
Veel plugins en thema's zijn afhankelijk van jQuery; neem je jQuery mee in het uitstellen, dan kunnen delen van de site zoals menu-toggles, sliders en pop-ups kapotgaan. Laat deze optie uit en zet hem alleen aan als het nodig is, na een test.
Excluded from Deferral
Vul je de bestandspaden in van scripts die niet goed werken als ze worden uitgesteld (sliders, formuliervalidatie, menu's enz.), dan worden ze uitgesloten van Defer en meteen geladen.
Deze optie zet na het laden van de pagina, tot er gebruikersinteractie is (scrollen, klikken, tikken enz.), het uitvoeren van JavaScript stil. Niet-essentiële JavaScript zoals advertenties, analytics en externe trackingscripts wordt zo uitgesteld, wat LCP (Largest Contentful Paint) en FCP verbetert.
Waar [Defer] na het parsen van de HTML uitvoert, stelt [Delay] het uitvoeren zelf uit tot de gebruiker iets doet. Scripts die meteen moeten werken, zoals autoplay of een eerste pop-up, zet je bij de uitzonderingen.
Delay JavaScript: zet je dit aan, dan is het aan te raden ook de 3 onderliggende opties aan te zetten.
Optie
Aanbevolen stand
Uitleg
Delay Behavior
Niet alle JS, alleen ‘niet-essentiële scripts’ uitstellen Aanbevolen: [Only Delay Specified Scripts (Default)]
Delay Timeout
Na een bepaalde tijd automatisch uitvoeren, ook zonder actie van de gebruiker (voor advertenties en statistieken, standaard 15 seconden)
Disable Click Delay
Direct reageren op klikken (betere INP, geen UX-vertraging)
Enable FastClick
Geen klikvertraging op mobiel (voorkomt aanraakvertraging op iOS)
Delay Behavior
Bepaalt of alleen opgegeven scripts of alle JavaScript wordt uitgesteld.
Als je alle bestanden uitstelt, kunnen bepaalde plugins of thema's problemen geven; sluit geïnstalleerde plugins en thema's dan uit via [Quick Exclusions]. Staan ze er niet bij, vul ze dan zelf in bij [Excluded from Delay].
Delay Timeout
Ook als de gebruiker niets doet (klikken, scrollen enz.), wordt de uitgestelde JavaScript na een bepaalde tijd automatisch uitgevoerd. Standaard staat dit op 15 seconden.
Met vertraagde uitvoering laadt de JS pas als de gebruiker ergens op klikt, en pas daarna wordt de aangeklikte actie (menu openen, knop enz.) uitgevoerd, waardoor de reactie na een klik iets later kan komen. Deze optie haalt die vertraging weg.
Situatie
Standaard Delay JS
Met Disable Click Delay aan
Klik van de gebruiker
Klikevent pas na het laden van JS → lichte vertraging
JS meteen uitgevoerd → snelle reactie op klikken
Enable FastClick
Met vertraagde uitvoering moet je soms twee keer klikken voordat iets werkt; dat gebeurt bij alle cache- en optimalisatieplugins. Deze optie verhelpt dat.
JavaScript › Minify
↳ JavaScript minificeren (Minify JavaScript)
Deze functie haalt overbodige tekens (spaties, regeleinden, commentaar enz.) uit JavaScript-bestanden om de bestandsgrootte zo klein mogelijk te maken, zodat zowel de overdracht als de parsetijd afneemt.
Bestanden die al geminificeerd zijn, eindigen op [.min.js]. Toont Google PageSpeed Insights of Lighthouse de waarschuwing [Minify JavaScript], zet deze optie dan aan om ook niet-geminificeerde scripts te comprimeren.
CSS › Unused
De CSS-instellingen bieden 2 methoden: ongebruikte CSS verwijderen en CSS minificeren.
↳ Ongebruikte CSS verwijderen (Remove Unused CSS)
Deze functie zoekt CSS-code die op de pagina niet echt wordt gebruikt en verwijdert die. WordPress-thema's en -plugins laden hun CSS-bestanden op bijna elke pagina, dus ongebruikte CSS maakt bestanden groter en verlengt de renderblokkering, wat LCP en FCP schaadt.
Zet je het aan, dan wordt per pagina alleen de echt benodigde CSS geëxtraheerd en ingevoegd; het effect is groot op sites met grote thema's (Elementor, Divi, Avada enz.) of veel plugins. Ontbreken er stijlen, bijvoorbeeld bij een slider of formulierbouwer, voeg die dan toe aan [Excluded Stylesheets].
Used CSS Method
De gebruikte CSS kun je inline invoegen of als apart bestand laden.
Inline (standaard): zet de benodigde CSS rechtstreeks in het HTML-document. Er zijn geen externe CSS-verzoeken, wat goed is voor FCP en LCP, maar de HTML van elke pagina wordt groter. Aanbevolen voor blogachtige sites met weinig CSS.
File: maakt van de gebruikte CSS een apart .css-bestand en laadt dat. De browsercache kan het bewaren, maar er komt één extern verzoek bij. Aanbevolen voor grote sites of builderpagina's met veel CSS.
Stylesheet Behavior
De optie voor het gedrag van stylesheets is de instelling die bepaalt hoe overbodige CSS-bestanden worden behandeld.
Instellingen
Werking
Kenmerken
🕒Delay (Default)
Laadt stylesheets iets later.
De standaardinstelling; werkt op de meeste sites stabiel en is gunstig voor de eerste rendering (FCP·LCP).
Vul een gewone CDN in zoals KeyCdn of Bunny CDN om de CSS-bestanden via de CDN te leveren. Cloudflare cachet automatisch alle resources die op DNS-niveau worden doorgegeven, dus die voeg je hier niet toe.
CSS › Minify
↳ CSS-bestanden verkleinen (Minify CSS)
Haalt spaties en commentaar uit CSS-bestanden om ze kleiner te maken. Werkt een functie van een plugin op de pagina voor bezoekers niet goed of verschijnt hij niet, voeg dan dat CSS-bestand toe.
Preloading › Preload
Deze functie laadt resources vooraf, zodat de rendering sneller gaat, en verbetert de eerste weergave (LCP) en het wisselen tussen pagina's. Er zijn 3 onderdelen: de basisonderdelen voor vooraf laden, speculatief laden en vooraf verbinden (Preconnect, DNS Prefetch).
Onderdeel
Invloed op serverbelasting
Invloed op Core Web Vitals (LCP / FCP / TTFB)
Preload
🔸 Iets hoger
✅ Betere LCP / ⚠️ TTFB ongewijzigd
Speculative Loading
🔺 Gemiddeld tot hoog
⚡ Betere LCP·FCP op de volgende pagina / ⛔ Weinig effect op de huidige pagina
Preconnect
🔹 Zeer gering
✅ Betere FCP·LCP (minder vertraging bij verbinden met externe resources)
DNS Prefetch
⚪ Vrijwel geen
⚪ Mogelijk iets betere FCP (indirect effect)
Preload Critical Images
Laadt belangrijke afbeeldingen vooraf en verkort zo de LCP-tijd (Largest Contentful Paint).
Chrome geeft van de voorgeladen afbeeldingen er maximaal 2 hoge prioriteit, dus geef er maar 2–3 op. Geef je er te veel op, dan wordt de server zwaarder belast en verschijnen afbeeldingen vóór de CSS, wat de CLS-score (Cumulative Layout Shift) kan verslechteren.
Preload
Laadt resources zoals lettertypen vooraf en verbetert zo de Largest Contentful Paint (LCP).
Welke resources je opgeeft, vind je in Google PageSpeed of op het tabblad Netwerk van Chrome DevTools. Laad je te veel resources vooraf, dan kan de total blocking time (TBT) stijgen.
Cloudflare Early Hints
Early Hints(HTTP 103), een functie waarmee de browser resources al begint te laden voordat de server de HTML helemaal heeft gemaakt. Het lijkt op preload, maar gebeurt eerder. Gebruik je Cloudflare, vink het dan aan.
In de browser is het een HTML-attribuut dat de laadvolgorde van resources bepaalt; je stelt het in als [<img fetchpriority="”high”">] of [“low”]. Preload dwingt af, Fetch Priority is een aanbeveling, dus de browser houdt ruimte om zelf te beslissen.
Klassenamen van afbeeldingen worden meestal gescheiden met een koppelteken (-) of underscore (_), maar zie je ze in Chrome DevTools zonder koppelteken, vul ze dan precies zo in.
Disable Core Fetch
Sinds WordPress 6.3 zet de core automatisch het attribuut [<img fetchpriority="”high”">] op de bovenste afbeelding, maar herkent niet altijd de LCP (het grootste element) goed. Zet je deze optie aan, dan blokkeer je die automatische instelling van de core en wordt in Perfmatters alleen de fetchpriority-waarde die je zelf opgeeft toegepast.
Preloading › Speculative Loading
Speculatief laden kent 4 modi: Auto(Default), Prefetch, Prerender en Disabled; voor de 3 modi behalve Disabled kies je daarna nog tussen automatisch (standaard), conservatief, gemiddeld en actief.
Modus
Uitleg
Kenmerken
Auto (Default)
De WordPress-core regelt speculatief laden automatisch
Werkt standaard op het niveau Conservative en is stabiel
Prefetch
Downloadt de resources van de volgende pagina vooraf (zonder te renderen)
Weinig belasting en sneller
Prerender
Rendert de gelinkte pagina vooraf op de achtergrond
Snelste paginawissel, maar zware serverbelasting
Disabled
Schakelt speculatief laden volledig uit
Verwijdert alle bijbehorende code; geschikt voor trage servers of shared hosting
Speculative Loading
└─ Modus: Auto(Default),Prefetch,Eagerness
├─ Eagerness instellen
│ ├─ Auto(standaard)
│ ├─ Conservative
│ ├─ Moderate
│ └─ Eager
│
└─ Disabled
Eagerness-niveau
Uitleg
Kenmerken
Auto (standaard)
De WordPress-core kiest automatisch een geschikt niveau
Werkt standaard op het niveau Conservative
Conservative
Laadt alleen vooraf als duidelijk is dat er geklikt wordt
Stabielst, zuinig met resources
Moderate
Laadt vooraf bij mouse-over (ca. 200 ms)
Goede balans tussen snelheid en efficiëntie
Eager
Laadt meteen vooraf, ook bij zwakke signalen
Snelst, maar gebruikt veel resources
Houd bij het instellen rekening met het hogere CPU-gebruik van de server en een site die in het algemeen trager kan worden.
[Links vooraf laden](Instant Page / Prefetch) in cacheplugins haalt een pagina alvast op wanneer je met de muis boven een link hangt. Speculatief laden is efficiënter voor de server, dus gebruik er maar één van; kies je speculatief laden, schakel dan het vooraf laden van links in je cacheplugin uit.
Soort
Instant Page(Prefetch)
Speculative Loading
Techniek
Haalt met JavaScript vooraf op bij hover over de [<a>]-tag
Gebaseerd op de native Speculation Rules API van de browser
Moment van werking
Als de gebruiker met de muis boven een link komt
De browser voorspelt automatisch de ‘kans op navigatie’ (hover, klik, aanraking en andere signalen)
Wat er geladen wordt
Haalt alleen de HTML van de gelinkte pagina vooraf op
Zowel Prefetch (alleen resources) als Prerender (inclusief rendering) mogelijk
Niveau
Losse fetch (vooral JavaScript)
Optimalisatie op netwerk- en renderniveau binnen de browser
WordPress integratie
Op basis van een extern script (instant.page)
Geïntegreerd in WordPress 6.8-core
Prestatie-efficiëntie
Snel, maar de browser heeft geen controle
Sneller en stabieler, bespaart resources
Preloading › Connection
Een functie die, voordat externe resources worden opgevraagd, de netwerkverbinding alvast klaarzet.
Onderdeel
Uitleg
Preconnect
Maakt vooraf een netwerkverbinding met externe resources (lettertypen, CDN, analysescripts enz.). De browser zet de verbinding al vóór het HTTP-verzoek op en spaart zo de round-trip-tijd uit.
DNS Prefetch
Zoekt de domeinnaam op voordat de gebruiker klikt. Voor als je de DNS-lookup nog iets sneller wilt.
Preconnect voor alle items gebruiken belast de serverresources, dus stel er maar 2–3 in.
//encrypted-tbn1.gstatic.com
//encrypted-tbn2.gstatic.com
//ep1.adtrafficquality.google
//fundingchoicesmessages.google.com
//pagead2.googlesyndication.com
//tpc.googlesyndication.com
//www.googleadservices.com
//googleads.g.doubleclick.net
//www.google.co.kr
//www.googletagservices.com
//www.youtube.com
//analytics.google.com
//www.google-analytics.com
De meeste cacheplugins hebben Preconnect / Prefetch al, dus gebruik je een cacheplugin erbij, laat deze twee functies dan uit.
Preconnect/DNS Prefetch
Actief
Perfmatters alleen
Samen met een cacheplugin
Lazy Loading › Images
Is Preload voor bestanden die meteen in beeld moeten komen, dan is Lazy Load voor afbeeldingen die pas na het scrollen verschijnen. Het laden wordt uitgesteld tot de gebruiker naar beneden scrolt en de afbeelding echt moet zien.
Het werkt volgens de door Google PageSpeed aanbevolen methode [Defer offscreen images] en heeft daardoor geen invloed op SEO.
Images
Preload Critical Images laadt de bovenste 2 afbeeldingen al vooraf en sluit ze automatisch uit van LazyLoad, dus stel je daarnaast Exclude Leading Images in, dan worden resources verspild door dubbel werk.
Lazy loading geldt niet voor achtergrondafbeeldingen.
iFrames and Videos
Deze functie stelt het laden van iframes en video's uit en geldt voor embeds zoals YouTube, Vimeo, SoundCloud en Google Maps en voor video's die met de tag [<video>] zijn ingevoegd.
Heb je YouTube-video's, zet dan de voorbeeldthumbnail aan. In plaats van de echte iframe toont het een lichte thumbnail en een SVG-afspeelicoon en laadt het de iframe pas bij een klik, wat de TBT (Total Blocking Time) verlaagt.
Exclude from Lazy Loading
Stel je afbeeldingen uit die meteen zichtbaar moeten zijn bij het openen van de pagina, zoals een uitgelichte afbeelding of logo, dan lijkt het scherm leeg of knippert het, en is het een afbeelding die meetelt voor LCP, dan gaat de score omlaag. Vul het bestandspad (example.png) of de klassenaam (class=”example”) in van de afbeelding die je wilt uitsluiten.
Gebruik je het thema GeneratePress, vul dan om het logo uit te sluiten de class [is-logo-image] in.
Om de uitgelichte afbeelding (thumbnail) van blogberichten uit te sluiten, vul je de class [class=”attachment-full size-full”] in.
ShortPixel of Imagify: gebruik je zo'n plugin die WebP-afbeeldingen levert, dan worden afbeeldingen uitgevoerd in de tag [<picture>]. Vul je de hele tag in, dan worden alle afbeeldingen op de site uitgesloten, dus geef liever een specifieke class of een pad op.
picture
.is-logo-image
.featured-image
/uploads/header/
Exclude by Parent Selector
Een optie om afbeeldingen via de class van de bovenliggende container uit te sluiten, als de afbeeldingstag zelf geen eigen class heeft, zoals bij uitgelichte afbeeldingen of galerijen.
Als de bovenliggende selector er bijvoorbeeld zo uitziet,
<div class=”featured-gallery”>
<img src=”image1.jpg”>
</div>
vul je het zo in.
featured-gallery
Threshold
Pas de drempelwaarde (Threshold) aan zodat afbeeldingen net voordat ze in beeld komen al worden geladen.
De standaardwaarde is 0px; wil je minder het gevoel dat afbeeldingen bij het scrollen plotseling verschijnen, verhoog hem dan iets naar 100px of 200px. Sites met veel advertentiescripts, zoals Mediavine of AdThrive, zetten hem op minstens 300px.
DOM Monitoring
Een functie die opmerkt wanneer er nieuwe elementen op de pagina bijkomen en nieuw toegevoegde afbeeldingen, iframes enz. automatisch via LazyLoad laadt. Nodig voor sites met dynamische content zoals tabbladen, oneindig scrollen, sliders en AJAX-paginering.
DOMContentLoaded is het moment waarop de eerste DOM klaar is; DOM Monitoring merkt de veranderingen daarna op.
Add Image Dimensions
Voegt ontbrekende breedte en hoogte aan afbeeldingen toe.
Fade In
Laat afbeeldingen niet plotseling verschijnen: een visuele aanvulling die er een zachte overgang van maakt.
⚙️Aanbevolen instellingen voor Lazy Loading
De aanbevolen instellingen uit Lazy Loading zie je hieronder.
Optie
Aanbevolen stand
Uitleg
Images
Lazy Load voor alle afbeeldingen
Exclude Leading Images
⚙️ 0 (Default)
Staat er in PreLoad al een aantal afbeeldingen ingesteld, laat dit dan op 0
iFrames and Videos
YouTube- en embedvideo's uitgesteld laden
YouTube Preview Thumbnails
Eerst alleen de thumbnail, de video zelf pas bij een klik
Exclude from Lazy Loading
⛔ Leeg laten
Handmatig opgeven als je bepaalde bestanden wilt uitsluiten
Exclude by Parent Selector
⛔ Leeg laten
Handmatig opgeven als je bepaalde containers wilt uitsluiten
Threshold
📏 300
Begint al te laden vlak voor de viewport
DOM Monitoring
Lazy Load blijft werken bij dynamische DOM-wijzigingen
Add Image Dimensions
Voorkomt CLS (voegt width/height automatisch toe)
Fade In
Zachte fade-in (betere UX)
Lazy Loading › CSS Background Images
CSS Background Images
Je kunt achtergrondafbeeldingen in CSS-stylesheets lazy laden.
Vul bij de achtergrondselector een ID of class in van de container met de achtergrondafbeelding, of van de bovenliggende container. Eén per regel, zonder prefix ( [.], [#]).
Exclude Leading sluit vanaf het eerste geladen element een bepaald aantal containers met achtergrondafbeeldingen uit van lazy loading. Gebruik je veel achtergrondafbeeldingen, gebruik dan Exclude Leading.
Optie
Aanbevolen stand
Uitleg
Background Images
Laadt de CSS-eigenschap [background-image:] uitgesteld. (bijv. achtergrond van de Hero-sectie)
Background Selectors
⛔ Leeg laten
Alleen invullen als je een specifieke achtergrondclass opgeeft (.div-background-class)
Exclude Leading
⚙️ 0 (Default)
Eerste achtergrondafbeelding meteen laden (hoofd-Hero enz.)
Lazy Loading › Lazy Elements
Lazy Elements
Zet het uitstellen van elementen in de DOM aan.
De DOM (Document Object Model) is de boomstructuur van elementen die de browser bouwt door het HTML-document te verwerken; hoe groter hij wordt, hoe meer geheugen, tijd voor stijlberekening, lay-outherberekening (Reflow) het kost.
Soort
Aantal nodes in de body
Status
Normaal
800 of minder
🟢 Normaal
Waarschuwing
Meer dan ca. 800
🟠 Let op
Fout
Meer dan ca. 1.400
🔴 Waarschuwing
De meeste cacheplugins hebben deze functie niet, dus zet hem ook aan als je een cacheplugin gebruikt. Je kunt ook specifieke elementen en bovenliggende containers opgeven.
Optie
Aanbevolen stand
Uitleg
Elements
Lazy Load voor de HTML-elementen zelf (kleinere DOM en lichtere eerste rendering)
Element Selectors
⛔ Leeg laten
Alleen invullen als je alleen bepaalde containers of secties uitgesteld wilt laden
Fonts
De belangrijkste functies op het tabblad Fonts komen neer op de keuze: Google-lettertypen lokaal laden of Google Fonts uitschakelen.
Local Google Fonts vs. Google Fonts uitschakelen
Local Google Fonts
Gebruik je Local Google Fonts, schakel dan dezelfde functie in andere thema's of cacheplugins uit.
Google Fonts uitschakelen
Host je Google Fonts lokaal, dan worden ze niet van buiten (de servers van Google) geladen, maar lokaal op de site opgeslagen en zelf gehost, waardoor er minder netwerkverzoeken zijn en de LCP verbetert.
Google Fonts uitschakelen blokkeert Google Fonts zelf en vervangt ze door standaardlettertypen van de browser (bijv. Arial, Helvetica, sans-serif). Zo heb je de minste netwerkverzoeken, maar de vormgeving kan minder consistent worden.
Display Swap
Ook voordat de webfont geladen is, toont de browser de tekst eerst in een systeemlettertype, zodat gebruikers de content meteen kunnen lezen en LCP en de ervaren snelheid verbeteren. Op CLS heeft het geen effect.
Print Method
De lokale stylesheet wordt standaard als bestand (File) uitgevoerd; zet je hem op inline (Inline), dan gaat de CSS rechtstreeks in de HTML, wat helpt om renderblokkering te verminderen en FCP en LCP te verbeteren. Wel wordt de pagina iets groter.
Limit Subsets
Laadt alleen de benodigde tekensets en maakt lettertypebestanden kleiner. Tekens van talen die je niet selecteert, worden misschien niet weergegeven, dus de gebruikelijke instelling is Latin(Default) plus de taal van je eigen land.
Meertalige plugins in gebruik? Dan is een cacheplugin die alle Google Fonts en Display Swap via de cache afhandelt de betere keuze.
CDN URL
Gebruik je een gewone CDN in plaats van Cloudflare, vul dan de URL in om de lokale lettertypen via de CDN te leveren.
Lokale lettertypen wissen
Verwijder de lokale lettertypen als je van thema bent gewisseld, een ander lettertype hebt gekozen of in je cacheplugin een ander lettertype hebt geselecteerd.
⤵️ Aanbevolen instellingen voor Fonts
Onderdeel
Aanbevolen stand
Uitleg
Local Google Fonts
Google Fonts worden niet van buiten (de servers van Google) geladen, maar lokaal op de site opgeslagen en zelf gehost. Er zijn minder netwerkverzoeken en lettertypen laden met minder vertraging, wat helpt bij een betere LCP.
Display Swap
Toont vóór het laden van de webfont eerst het systeemlettertype, zodat het knipperen van tekst (FOUT) afneemt. Betere LCP en snellere ervaren laadtijd; op CLS heeft het geen effect.
Print Method
Standaard is het File; kies je Inline, dan wordt de CSS in de HTML gezet, wat goed is voor zo min mogelijk renderblokkering en betere FCP/LCP. Wel kan de HTML iets groter worden.
Limit Subsets
Laadt alleen de benodigde tekensets en maakt lettertypen kleiner en sneller te laden. Bijv. [Latin(Default)] kiezen; Nederlands zit al in Latin, dus meer is niet nodig. Hindi en andere Indiase talen hebben een aparte subset (Devanagari enz.) nodig. Ook met een meertalige plugin is dit aan te raden.
CDN URL
⚙️ Optioneel
Gebruik je naast Cloudflare een aparte CDN, dan kun je het pad opgeven. Meestal leeg laten.
Clear Local Fonts
🔁 Uitvoeren wanneer nodig
Verwijdert bij een ander thema, andere lettertypen of een andere cacheplugin de bestaande lokale lettertypen en maakt een nieuwe cache aan.
Google Fonts uitschakelen
Blokkeer je Google Fonts helemaal, dan verdwijnen de externe verzoeken, maar alle lettertypen van het thema vallen weg en je krijgt standaardlettertypen (Arial enz.) te zien. De vormgeving kan daardoor minder consistent worden, dus laat dit uit als je Local Google Fonts gebruikt.
CDN
CDN URL Rewrite werkt door eerst de URL in te vullen en daarna de mappen toe te voegen die erbij horen. Met wp-content en wp-includes gaan alle afbeeldingen, CSS, JS en lettertypen via de CDN, en bestanden die je niet wilt, kun je van de CDN uitsluiten.
Analytics
Met een plugin van Google, zoals Site Kit, kun je Google Analytics koppelen. Maar na het installeren van Site Kit zie je al bij één test in Google PageSpeed Insights dat de prestaties dalen. Wil je Google Analytics koppelen en via een lokale instelling sneller maken, zet dit dan aan.
Stel je Google Analytics zowel hier als in Site Kit of in SEO-plugins zoals Yoast en RankMath in, dan worden het 2 HTTP-verzoeken in plaats van 1; kies dus één plek.
Code › Snippets
Hier sla je PHP-, CSS-, JS- en HTML-snippets op en zet je ze aan of uit. Toevoegen doe je met [New Snippet].
De snippet die Claude MCP-verbindingsfouten voorkomt, stel je zo in.
<> Code
All Snippets / MCP REST API exception
ActiveSave Snippet④
Name②
MCP REST API exception
Location
Everywhere⌄
Type
PHPJSCSSHTML
Code③
<?php
1// Let WP Rocket MCP (OAuth) requests through the Perfmatters REST API restriction
②Vul een naam in en laat [Location] op [Everywhere] en [Type] op [PHP] staan.
③Haal de code op met [Copy] op dit scherm en plak hem in het codeveld onder de regel [<?php].
④Zet de schakelaar op [Active] en klik op [Save Snippet].
Code › Global Scripts
Hier zet je code die in de header, body en footer van de hele site moet komen: voor code die op elke pagina nodig is, zoals analytics of verificatietags.
Code › Settings
Hier vind je export en import van snippets, het editorthema en Safe Mode. Opent de site niet meer door een snippet, ga dan via de Recovery URL naar binnen en zet hem uit.
Tools › Plugin
De andere functies op het tabblad Tools zijn optioneel; de afbeelding hieronder is genoeg om ze te begrijpen. Wat je aanzet, zijn twee dingen: de Script Manager en de geavanceerde opties uit de instellingen die we tot nu toe hebben besproken.
Tools › Settings
Database
Biedt je cacheplugin geen databaseoptimalisatie, dan kun je die van Perfmatters gebruiken; welke je ook kiest, neem gewoon wat jou het makkelijkst uitkomt.
Ⅲ. Zo gebruik je de Script Manager van Perfmatters
De Script Manager van Perfmatters gebruik je nadat je in het beheerdashboard op de knop ‘Site bekijken’ hebt geklikt. Hoe het beheerscherm eruitziet, kan per thema of plugin verschillen; overbodige scripts zet je uit met de activatieknop van dat onderdeel, zodat ze niet worden geladen.
Laat je bijvoorbeeld de Dashicons, die je in de algemene instellingen van Perfmatters kunt uitschakelen, aan staan en wil je ze alleen op bepaalde pagina's uit, dan kan dat in de Script Manager.
Ⅳ. Conclusie & FAQ
Perfmatters is niet zomaar een [plugin om de site sneller te maken] die scripts en resources weghaalt, maar een tool die inefficiëntie in de hele WordPress-structuur aanpakt en zo de stabiliteit en beheerbaarheid van de site tegelijk verbetert.
Het gaat er niet om [alle functies aan te zetten], maar om de aard van je site en de opbouw van je plugins te begrijpen en gericht te kiezen.
Perfmatters is een plugin die overbodige code en verzoeken beheerst en zo de opbouw van de site zelf lichter maakt. Door te bepalen hoe CSS, JS, lettertypen en afbeeldingen laden, gaat de Core Web Vitals-score omhoog en de serverbelasting omlaag.
Perfmatters is [voor betere prestaties van de hele site], Asset CleanUp [voor het beheren van losse resources].
Voor de gemiddelde WordPress-beheerder is Perfmatters de praktischere en stabielere keuze.
De meest effectieve combinatie is WP Rocket + Perfmatters.
WP Rocket zorgt voor de statische optimalisatie zoals cache, compressie en preload, en Perfmatters voor de dynamische optimalisatie door code, resources en verzoeken te beheren, zodat ze elkaar niet overlappen.
🧭Gerelateerde berichten over WP Rocket·Perfmatters15 artikelen · 3 tools
🗂️ Wat is WP?
📋 WP Rocket instellen📄 Perfmatters-gids📄 WP Rocket With Perfmatters📄 WP Rocket MCP Server📄 WP Rocket en Koreaanse URL's📄 nginx njs📄 Meertalige cache van WP Rocket📄 gclid-cache
📄 WP Rocket snelheidstest📝 Cache- en optimalisatieplugins📝 Voorbeeld van snelheidswinst
📋 Cache: definitie en alle toepassingen📄 Websitecache & servercache
ℹ️ Affiliatemelding De content van deze site bevat affiliatelinks. Koopt een bezoeker via een van deze links een product of dienst, dan ontvangt deze site een commissie van de verkoper. Het bedrag dat de koper betaalt (bij acties gaat het omlaag ↓) wordt daardoor niet hoger. De vermelde prijzen, kortingen en voorraad gelden op het moment van schrijven en kunnen afwijken; controleer ze daarom vóór je aankoop bij de verkoper. Producten worden gekozen en beoordeeld volgens onze eigen criteria, en commissies hebben geen invloed op de volgorde of de inhoud van de beoordelingen.