Prestaties en Core Web Vitals

4 min read

TTSWP voegt audio toe aan je pagina's zonder de prestaties te schaden. De speler wordt lazy-loaded, assets zijn geoptimaliseerd, en niets wordt uitgevoerd bij het laden van de pagina tenzij dat nodig is. Zo houden we Core Web Vitals veilig.

Impact op Core Web Vitals

LCP (Largest Contentful Paint)

Impact: geen

De audiospeler wordt lazy-loaded. Hij rendert geen JavaScript en laadt er geen totdat de bezoeker er dichtbij scrollt. LCP, dat de tijd meet om de belangrijkste content boven de vouw te renderen, wordt niet beinvloed.

Test: voer voor-en-na Lighthouse-audits uit. LCP-scores blijven binnen de normale variatie.

CLS (Cumulative Layout Shift)

Impact: nul

De placeholder van de speler heeft exact dezelfde afmetingen als de volledig geladen speler. Wanneer lazy load de overgang van placeholder naar volledige speler activeert, treedt er geen layout shift op.

INP (Interaction to Next Paint)

Impact: verwaarloosbaar

De JavaScript van de speler draait in een enkel klein bestand (ongeveer 15 KB gezipt). Click handlers zijn gedebounced en draaien op requestIdleCallback waar ondersteund. Typische INP-bijdrage: onder de 5 ms per interactie.

FID (First Input Delay, vervangen door INP in 2024)

Impact: nul

Niets blokkeert de main thread bij het eerste laden van de pagina, omdat de speler lazy laadt.

Assetgroottes

Laadkosten per pagina wanneer de speler in gebruik is:

Asset Grootte (gezipt) Wanneer geladen
Publieke speler CSS 3 KB Wanneer speler zichtbaar
Publieke speler JS 15 KB Wanneer speler zichtbaar
Golfvorm helper (PRO) 4 KB Wanneer golfvorm ingeschakeld
Sticky footer JS (PRO) 2 KB Wanneer sticky ingeschakeld
Adminbalk menupictogram 0,5 KB Alleen voor beheerders

Totale impact bij eerste lading voor bezoekers: 0 bytes totdat ze naar de speler scrollen.

Compatibiliteit met cacheplugins

TTSWP werkt met alle grote cacheplugins (WP Rocket, LiteSpeed, W3 Total Cache, WP Super Cache, Cache Enabler). De plugin registreert zijn assets automatisch voor correct cachegedrag.

Audiobestanden (MP3) hebben hun eigen cacheheaders en worden op aanvraag geladen vanuit opslag. Ze verstoppen paginacaches niet.

Zie Cacheplugins.

CDN-levering

Op betaalde abonnementen worden audiobestanden geserveerd via Amazon CloudFront. Dit betekent:

  • Audio speelt binnen milliseconden na het klikken op Afspelen, zelfs voor bezoekers ver van je server
  • De bandbreedte van je WordPress-server blijft vrij voor HTML

Op gratis abonnementen komt audio van je WordPress-server. Voor de meeste blogs is dat prima. Drukbezochte sites merken mogelijk bandbreedtegebruik op pagina's met veel audio.

Database-impact

TTSWP voegt een klein aantal databasetabellen en rijen toe:

  • Audiocachetabel (een rij per gegenereerd bestand)
  • Statistiektabellen (een rij per afspeelgebeurtenis - kleine integer-data)
  • Instellingrijen (een paar dozijn opties)

De databasegrootte groeit lineair met het aantal berichten met audio. Voor een site met 500 berichten is de totale database-footprint doorgaans onder de 200 KB.

Geheugen en CPU

  • PHP-geheugenoverhead per admin-paginagelading: ~2 MB
  • PHP-geheugenoverhead per publieke pagina met speler: verwaarloosbaar (alleen CSS en JS, geen PHP-verwerking op hot paths)
  • Achtergrondprocessen: geen (geen cron-taken die bij elk verzoek draaien)

Je site testen

Gebruik deze tools om te controleren dat TTSWP je prestaties niet schaadt:

Voer de test eenmalig uit met TTSWP ingeschakeld en eenmalig met tijdelijk uitgeschakeld. Vergelijk de cijfers.

Als je een prestatieachteruitgang ziet

Laat het ons weten. We behandelen prestatieachteruitgangen als bugs:

  1. Noteer welke pagina traag is
  2. Voer PageSpeed Insights uit en deel de URL
  3. Neem contact op via PRO Support of post in het WordPress.org-forum

We helpen je het te diagnosticeren en op te lossen.

Gerelateerde pagina's