Hoe we de mobiele laadtijd verlaagden van 6.1s naar 2.2s (+34% Conversie)

1. Het Probleem: Onzichtbare Vertraging door Verwijderde Apps

De winkeleigenaar zag een verontrustende trend: ondanks constante advertentie-uitgaven op Meta en Google, verliet een groot deel van de smartphonebezoekers de productpagina voordat de afbeeldingen volledig geladen waren.

Uit een diepgaande analyse met Chrome DevTools en Google Lighthouse kwamen drie grote knelpunten naar voren:

• Achtergebleven 'Spookcode': In anderhalf jaar tijd had de webshop 9 verschillende apps geïnstalleerd en weer verwijderd (bundel apps, currency switchers, popups). Geen van deze apps had de tracking-scripts netjes verwijderd uit theme.liquid, waardoor er bij elk paginabezoek onnodige vertragende JavaScript werd ingeladen.
• Niet-geoptimaliseerde Banners: De homepage en categoriebanners bestonden uit zware PNG-bestanden van ruim 4MB, zonder WebP-formaat of responsive <picture> tags voor telefoons.
• Blokkerende Externe Lettertypen: Drie verschillende lettertypen werden synchroon via externe servers ingeladen, wat voor 2.4 seconden wit scherm zorgde op 4G-verbindingen.

2. Het Stappenplan: Schoonmaken en Versnellen

STAP 1 Handmatige Opschoning van Liquid & Scripts

We doorliepen handmatig alle theme-bestanden en verwijderden alle dode JavaScript-links, verouderde tracking pixels en ongebruikte CSS-bestanden. Dit verlaagde de netwerkbelasting direct met meer dan 40%.

STAP 2 Kritieke CSS Direct Inladen & Rest Uitstellen

De styling die nodig is om de bovenkant van het scherm te tonen (Above-the-Fold) werd direct ingebed. Zware scripts zoals livechat, reviews en analytics werden uitgesteld tot na de eerste interactie van de bezoeker.

STAP 3 WebP Afbeeldingen & Responsive Formaten

Alle afbeeldingen werden omgezet naar geoptimaliseerd WebP-formaat met vaste afmetingen. Mobiele telefoons laden nu een compacte 400px versie in plaats van een zware 2400px desktopafbeelding. De layout shift (CLS) daalde hierdoor naar 0.01 (ruim onder de Google-drempel van 0.10).

STAP 4 iDEAL & Kassa-afhandeling Controleren

We optimaliseerden de checkout flow om haperingen bij iDEAL- en Mollie-betalingen te voorkomen, inclusief automatische adresaanvulling via de browser.

3. Het Eindresultaat

Binnen 48 uur na livegang daalde de mobiele Largest Contentful Paint (LCP) van 6.1 seconden naar 2.2 seconden.

In de 30 dagen daarna zag de webshop:

• +34% stijging in voltooide mobiele bestellingen uit betaald verkeer.
• Mobiele prestaties behaalden permanent groene Google Core Web Vitals (met 'Goed' scores voor LCP en CLS).
• Minder klantvragen over trage kassa's of vastlopende winkelwagens.