Waarom is een templatewebsite traag?

Kort samengevat

• Een thema bevat functies voor bedrijven die jij niet bent.
• Plug-ins laden hun scripts ook op pagina's waar ze niets doen.
• Meet je paginagewicht zelf met het Network-tabblad in je browser.
• Caching verzacht het symptoom, maar haalt het gewicht er niet uit.

Een templatewebsite is traag omdat het thema functionaliteit bevat voor allerlei soorten bedrijven, en die code wordt meegeladen ook op pagina's waar hij niets doet. Daar komen plug-ins bij die hun eigen scripts en stijlen toevoegen. Het resultaat is een pagina die veel meer moet verwerken dan hij toont.

Dat is geen slecht gebouwd thema. Het is de logische uitkomst van één product dat duizenden bedrijven tegelijk moet bedienen.

Waar komt het gewicht vandaan?

Vier bronnen, in volgorde van hoeveel ze meestal bijdragen:

1. Themafunctionaliteit die je niet gebruikt. Sliders, portfoliofilters, prijstabellen en animaties die voor een ander type bedrijf bedoeld zijn.
2. Plug-ins. Elke plug-in laadt eigen scripts en stijlen, vaak sitebreed en niet alleen op de pagina waar hij werkt.
3. Onbewerkte afbeeldingen. Een foto van 4 MB rechtstreeks uit de camera, in de browser geschaald naar een kleiner formaat.
4. Externe scripts. Lettertypen, chatwidgets, reviewsliders en trackingpixels van andere servers.

Punt één en twee zijn specifiek voor een themaopzet. Punt drie en vier kun je overal tegenkomen; zie waarom je website traag is voor die algemene kant.

Waarom laadt een thema wat je niet gebruikt?

Een thema wordt verkocht aan duizenden bedrijven tegelijk. Een kapsalon, een hovenier en een advocatenkantoor draaien op hetzelfde sjabloon, en dus moet dat sjabloon voor alle drie iets kunnen.

De bouwer weet vooraf niet welke onderdelen jij aanzet. Daarom zit alles erin, en wordt in de praktijk veel ervan geladen ongeacht wat je gebruikt. Jij betaalt de laadtijd van functionaliteit die voor iemand anders bedoeld was.

Hoe meet je het zelf?

Dit kost twee minuten en geeft een concreter beeld dan een prestatiecijfer:

1. Open je site in Chrome.
2. Druk op F12 en ga naar het tabblad Network.
3. Ververs de pagina met Ctrl+R of Cmd+R.
4. Kijk onderaan naar requests en transferred.

Wat je ziet, plaats je zo:

Sorteer daarna op grootte. De bovenste drie regels vertellen je meestal meteen waar je winst zit, en vaak zijn dat afbeeldingen.

Waarom lost caching het niet op?

Caching zorgt dat je server een pagina niet bij elk bezoek opnieuw hoeft op te bouwen. Dat helpt voor de tijd tot het eerste antwoord, en het is zeker de moeite waard.

Wat caching niet doet, is de hoeveelheid code verkleinen die de browser van je bezoeker moet downloaden en verwerken. Die 90 verzoeken blijven 90 verzoeken. Op een telefoon met een matige verbinding is dat het deel dat pijn doet.

Je bestrijdt met caching dus een symptoom. Dat is soms genoeg, maar verwacht er geen wonder van als je pagina anderhalve megabyte weegt.

Wat kun je eraan doen?

Op volgorde van moeite:

• Comprimeer je afbeeldingen naar webp en maximaal 200 KB per stuk. Vaak de grootste winst voor de minste moeite.
• Schoon je plug-ins op. Kijk per plug-in of je hem nog gebruikt; abonnementen en scripts lopen stil door.
• Zet ongebruikte themaonderdelen uit, voor zover je thema dat toestaat.
• Verwijder externe scripts die je niet meer bekijkt, zoals een oude chatwidget.
• Overweeg een andere opzet als je na dit alles boven de vier seconden blijft.

Dat laatste is een echte afweging, geen verkooppraatje. Wat op maat bouwen daaraan verandert, staat in wat een website op maat is.

Veelgestelde vragen

Zijn alle templatewebsites traag?

Nee, maar ze beginnen met een achterstand. Een thema bevat functionaliteit voor allerlei soorten bedrijven en laadt die mee. Met goede caching en geoptimaliseerde afbeeldingen haal je nog steeds prima tijden; het kost alleen meer moeite.

Hoe meet ik hoeveel mijn pagina weegt?

Open je site in Chrome, druk op F12 en ga naar het tabblad Network. Ververs de pagina en kijk onderaan naar 'transferred'. Alles boven een megabyte voor een gewone pagina is zwaar voor mobiel gebruik.

Helpt een cachingplug-in tegen een traag thema?

Deels. Caching voorkomt dat je server elke pagina opnieuw opbouwt, maar het verkleint de hoeveelheid code die de browser moet verwerken niet. Je bestrijdt er een symptoom mee, niet de oorzaak.

Is overstappen van thema naar maatwerk de moeite waard?

Dat hangt af van wat je nu verliest. Laadt je site boven de vier seconden op mobiel en komt het grootste deel van je bezoekers daarvandaan, dan verdien je een snellere opzet doorgaans terug in aanvragen.

Conclusie: meet eerst, beslis daarna

Een thema is niet slecht, maar het draagt gewicht mee dat voor andere bedrijven bedoeld is. Open het Network-tabblad, kijk wat je pagina weegt en sorteer op grootte. In tien minuten weet je of je een afbeeldingenprobleem hebt of een structureel probleem.

Bij het eerste ben je met comprimeren klaar. Bij het tweede is een andere opzet de eerlijkere oplossing dan nog een plug-in die de vorige moet compenseren.

Wil je weten wat er bij jou aan de hand is? Plan een gratis adviesgesprek van vijftien minuten.

Geschreven door Tom de Waard, eigenaar van Klozley, websitebureau in Hoofddorp.