Wat zijn third-party scripts? Uitleg en impact

Definitie

Third-party scripts zijn stukken JavaScript van externe partijen, zoals tag managers, chatwidgets, reviewtools en advertentiepixels. Ze zijn vaak de grootste oorzaak van een slechte INP.

Wat zijn third-party scripts?

Alles wat je shop laadt van een domein dat niet van jou is, telt als third-party. Google Tag Manager en alles wat daarin hangt, Meta- en TikTok-pixels, chatwidgets, reviewwidgets, A/B-testtools, heatmaps, consentbanners, betaalknoppen en aanbevelingsengines. Elk script haalt bestanden op, voert code uit en voegt soms nog meer scripts toe.

Het probleem is dat die code op dezelfde main thread draait als je eigen shop. Rekent een tracking-script net als de bezoeker op een filter klikt, dan wacht de klik. Dat zie je terug in INP. Scripts die zichtbare elementen toevoegen, zoals een reviewbalk of chatknop, kunnen ook CLS veroorzaken.

Ook de volgorde telt. Een script dat synchroon in de head staat, houdt de hele pagina tegen tot het geladen is. Staat de server van die externe partij even stil, dan staat jouw shop ook stil. Dat heet een single point of failure, en je hebt er geen controle over.

Waarom het ertoe doet voor webshops

Webshops stapelen tools. Elke marketingcampagne, elk experiment en elke nieuwe app voegt een script toe. Zelden gaat er een weg. Na een paar jaar draait een shop met tientallen externe verzoeken, waarvan een deel niet meer gebruikt wordt.

Je eigen code kun je optimaliseren, third-party code niet. Je hebt alleen invloed op of, wanneer en hoe je die laadt. Daarom begint elke snelheidsaudit met een inventarisatie: welk script, van wie, wat levert het op, en wat kost het aan laadtijd en main-thread-tijd. Een tool die niemand meer bekijkt, is pure kosten.

A/B-testtools met een anti-flicker-snippet verdienen extra aandacht. Die verbergen de pagina tot het testscript geladen is. Dat vertraagt FCP en LCP direct.

Maak de afweging per script concreet. Wat levert de reviewwidget op aan conversie? Wat kost hij aan laadtijd? Zonder die rekenstap blijven scripts staan omdat niemand weet wat ze doen. Een kwartaalcheck van alle tags in GTM en alle app-embeds is genoeg om de stapel beheersbaar te houden.

Let ook op privacy. Elk extern script kan gegevens van je bezoekers verwerken. Wat je om snelheidsredenen opruimt, scheelt vaak ook in je verwerkingsregister en je consentbanner.

Zo pak je het aan in Magento, Shopify en Laravel

Bij Shopify komen de meeste scripts uit apps. Verwijder je een app, controleer dan of de code ook uit je thema is verdwenen; oude snippets blijven vaak achter. Voor tracking biedt Shopify Customer events met web pixels, die in een sandbox draaien en minder invloed hebben op de pagina zelf.

Bij Magento komen scripts uit extensies en uit de head-instellingen onder Content > Design > Configuration. In Hyvä kun je scripts uitstellen tot de eerste interactie van de bezoeker, zodat ze de eerste weergave en eerste klik niet blokkeren. In Laravel bepaal je zelf de laadvolgorde in je layout.

Algemene technieken: laad met defer of async, laad chatwidgets pas na een klik op een eigen, lichte knop (facade-patroon), verplaats tags waar mogelijk naar server-side tracking, en verwijder alles wat geen meetbare bijdrage levert.

Veelgemaakte fouten

Alles in GTM zetten met de gedachte dat het dan niet meer telt. GTM is zelf ook een script, en alles wat erin hangt draait gewoon op de pagina. Ook fout: dezelfde pixel twee keer laden, via een app en via GTM. En alleen in Lighthouse testen zonder consent, waardoor je de scripts die na het accepteren laden helemaal niet meet.

Meet voor en na elke opruimronde. Field data voor INP en LCP laten zien wat het voor echte bezoekers oplevert.

Chatwidget pas laden na een klik

<button id="chat-facade" type="button">Chat met ons</button>
<script>
  document.getElementById('chat-facade').addEventListener('click', () => {
    const s = document.createElement('script');
    s.src = 'https://widget.voorbeeldchat.nl/loader.js';
    s.async = true;
    document.head.appendChild(s);
  }, { once: true });
</script>

Verder lezen

Gerelateerde begrippen

INP (Interaction to Next Paint)Core Web Vitals CLS (Cumulative Layout Shift)Server-side tracking Consent Mode FID (First Input Delay)

Veelgestelde vragen

Vertragen scripts in Google Tag Manager mijn shop?+

Ja. GTM laadt ze alleen in, ze draaien daarna gewoon op de pagina. Elk script kost laadtijd en main-thread-tijd.

Hoe vind ik welke scripts het zwaarst zijn?+

Gebruik het Performance-paneel in Chrome DevTools of de third-party-overzichten in Lighthouse en PageSpeed Insights. Vergelijk met en zonder consent.

Wat is een facade voor een chatwidget?+

Een lichte knop die eruitziet als de widget. Het echte script laadt pas als de bezoeker erop klikt.

Third-party scripts