Een trage Shopify-webshop? Dan wordt vaak eerst naar het thema gekeken, of naar de afbeeldingen. Begrijpelijk, maar bij de webshops die wij onderhouden zit de grootste rem meestal ergens anders: in de apps.
Elke app die je installeert, kan extra code meesturen naar de browser van je bezoeker. Eén app is zelden een probleem. Maar na een paar jaar groeien, testen en vergeten draait er al snel een stapel scripts mee die niemand meer kent.
Een voorbeeld uit de praktijk
Bij een webshop die we onderhouden hebben we precies uitgezocht waar de laadtijd naartoe ging. Op een productpagina besteedde de browser van een bezoeker ruim 22 seconden aan het uitvoeren van scripts (gemeten in Lighthouse, op een gesimuleerde, trage telefoon). Het thema zelf was daar maar een paar procent van.
De grootste boosdoener was een vertaal-app. Die vertaalde de pagina in de browser opnieuw, terwijl Shopify de pagina al in de juiste taal aanleverde. Deze ene app nam ongeveer 70% van alle rekentijd voor zijn rekening.
Na overleg met de klant ging de app uit. Het resultaat op dezelfde pagina:
- Blokkeertijd: van 1.763 naar 617 milliseconden, 65% minder. Dat is de tijd waarin de pagina niet reageert op tikken en scrollen.
- Rekentijd voor scripts: van bijna 17 naar ongeveer 6 seconden.
- De webshop werkte gewoon door, in de juiste taal, omdat Shopify die vertaling al zelf deed.
Niet elke app is schuldig
Net zo leerzaam: niet alles wat zwaar oogt, maakt je webshop ook meteen traag.
- Code verkleinen leverde niets op. Dat stond op de planning, maar bleek overbodig: Shopify verkleint en comprimeert de code van je thema al automatisch. Die uren hebben we dus niet gerekend.
- Een upsell-app laadde 20 extra bestanden, maar pas nadat de pagina al zichtbaar was. Weghalen maakte de pagina niet sneller. Er was wel een andere reden om er kritisch naar te kijken: de app verving de winkelwagen van het thema en schakelde daarmee functies uit, zoals de keuze voor cadeauverpakking.
De les: meet eerst en kijk daarna pas wat je weghaalt.
Zo spoor je trage apps zelf op
- Maak een lijst van je apps in je Shopify-beheer. Weet je bij een app niet meer waarvoor hij is? Dan is dat je eerste kandidaat.
- Kijk of de app iets doet wat Shopify zelf al kan. Vertalingen, valuta, recensies en filters zitten inmiddels voor een groot deel in Shopify zelf.
- Meet met PageSpeed Insights op je homepage, een categorie en een productpagina. Kijk in het rapport bij "JavaScript-uitvoeringstijd verkorten": daar zie je welke scripts de meeste tijd kosten, vaak met de naam van de app erin.
- Test zonder de app in een kopie van je thema, voordat je hem echt verwijdert.
- Ruim restjes op. Sommige apps laten na het verwijderen nog code achter in je thema.
Wat levert het op?
Een snellere webshop voelt prettiger, en bezoekers haken minder snel af. Vooral op telefoons, waar het meeste verkeer vandaan komt, maakt een halve seconde al verschil. Daarnaast weegt snelheid mee in hoe Google je pagina's beoordeelt.
Wil je weten wat jouw apps kosten?
We lichten je Shopify-webshop graag door: welke apps vertragen, wat je kunt missen en wat het oplevert. Altijd eerst gemeten, nooit op gevoel. Neem contact met ons op.