Load Third Party đź’© Dependencies later using Google Tag Manager! [English]

super schnell google tag manager

Everybody knows it. You work hard to make you website fast and faster. Do everything in the book of webperformance-speed to get the green rating in Page Speed Insights and then after you have done everything an more you get hit with this message:

Reduce the impact of third party code? What? Google is telling me, it’s not me, it’s …..

  • Google Tag Manager
  • Facebook Pixel
  • Google Analytics
  • Google Conversion Tracking
  • 10 000 other external scripts, conversion tools and third party crap we have on our website!

The best solution would be to just kick all this stuff out, but as there are usually „good“ reasons (or at least „a“ reason) to have them, here is a way to make them fast.

1) Load 3rd crap via Google Tag Manager

Google Tag Manager (GTM) was a really bad tool the first few years of its existence. Nowadays its a pretty cool, powerful power tool. Just deploy every 3rd party dependencies via GTM.

Google Tag Manager | Google Developers

2) Create a new TAG called „minimal-user-interaction“

  • Typ: Tag → Custom HTML
  • Name: minimal-user-interaction
  • Code ➡️ Github-Gist
  • Trigger: All Pages – Page View

We create a TAG called „minimal-user-interaction“ that is loaded every pageview, the tag fires an EVENT called „minimal user interaction“. The tag is executed once as soon as a User:

  • moves their mouse – or –
  • starts to scroll – or –
  • sets focus (i.e.: users with screenreaders)
  • touches their mobile screens.

These are all events that users trigger, but not Google or other bots.

3) Create a new TRIGGER called „minimal-user-interaction“

  • Typ: Trigger
  • Name: minimal-user-interaction
  • Event name: minimal-user-interaction
  • Trigger Type: Custom Event
  • Fires on: All Custom Events

Wir legen einen Trigger namens „minimal-user-interaction“ an, der getriggered wird, wenn eine Event namens „minimal-user-interaction“ gefeuert wird.

We create a TRIGGER called „minimal-user-interaction“, that gets triggered when the EVENT called „minimal-user-interaction“ gets fired.

4) Existing TAGs load based on the „minimal-user-interaction“ TRIGGERS.

i.e.: change

to

I recommend loading all conversion-tags, ad-tags and other tags at the earliest after „minimal-user-interaction“ or even later. All except Google Analytics, otherwise the bounce rate will be falsified. Google then still complains about Google Analytics, but you still pass the Page Speed Insights test.

Note: the tag „minimal-user-interaction“ still has „All Pages“ as a trigger, as this tag is the one that fires the „minimal-user-interaction“ event.

5) That’t it.

Thats it‘.

Note: if you load that much 3rd party crap that the browser starts „jittering“ or becomes otherwise unusable as soon as the users does something, then really evaluate if you need all the stuff that you load. And then start deleting.

P.s.: here an export of a Google Tag Manager Container if you want to play around with this setup quite fast https://gist.github.com/franzenzenhofer/2494425305cfc472b9381d2f161c5755

2 Gedanken zu „Load Third Party đź’© Dependencies later using Google Tag Manager! [English]“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Ăśber Franz Enzenhofer

Hi. Ich bin Franz. SEO-Urpionier aus Österreich. Seit 1998 beschäftige ich mich mit Webseiten und SEO. Man kann im deutschsprachigen Raum nur schwer online gehen, ohne – via Google – auf eine Website zu kommen, die ich nicht auf die eine oder andere Art und Weise optimiert habe.