Die Website reagiert zäh, Klicks auf Menü oder Formular kommen verzögert an, und die Entwicklung findet im eigenen Code keine Ursache. In Audits suche ich in solchen Fällen zuerst im Google Tag Manager. Dort steckt erstaunlich oft ein Custom HTML Tag, das bei jedem Seitenaufruf oder Klick mehr rechnet, als es sollte.

Nach diesem Artikel können Sie prüfen, ob Tags in Ihrem Container die Website ausbremsen, und wissen, wie Sie solche Tags entschärfen.

Warum Custom HTML Tags die Seite blockieren können

Custom HTML Tags laufen im Browser auf dem Main Thread, also dem einen Strang, auf dem auch Darstellung und Reaktion auf Eingaben stattfinden. Solange ein Skript dort rechnet, wartet jeder Klick. Google bezeichnet jede Aufgabe über 50 Millisekunden als Long Task und beschreibt die Folgen im Artikel zum Optimieren von Long Tasks.

Typische Auslöser in Containern, die ich übernehme: Schleifen über alle Elemente der Seite, synchrone Requests, die auf eine Antwort warten, und DOM-Zugriffe direkt beim Laden. Das Tückische daran: Im GTM sieht alles normal aus, das Tag feuert und liefert Daten. Google weist in den Best Practices für Tags und Tag Manager außerdem darauf hin, dass Messtools solche Last häufig dem Tag Manager insgesamt zuschreiben, nicht dem einzelnen Tag.

Woran Sie es erkennen

Den Verursacher finden Sie in den Entwicklertools von Chrome:

  1. Öffnen Sie Ihre Website und in den Entwicklertools den Tab „Performance“.
  2. Starten Sie eine Aufnahme, laden Sie die Seite neu und klicken Sie typische Elemente wie Formular oder Menü an.
  3. Suchen Sie Tasks mit rotem Dreieck in der Ecke, das sind Long Tasks.
  4. Klappen Sie diese auf und prüfen Sie, ob gtm.js oder ein von dort geladenes Skript beteiligt ist.

Lösung: Eigenen Code reduzieren und Logik verlagern

Prüfen Sie jedes Custom HTML Tag mit einer Frage: Gibt es dafür eine Vorlage? Für die meisten Werbe- und Analyseplattformen existieren fertige Tags oder Vorlagen aus der Community Template Gallery. Sie laufen mit festgelegten Berechtigungen und sind laut Google deutlich seltener die Ursache von Performance-Problemen.

Wo eigener Code bleibt, verlagern Sie die teure Arbeit. Daten wie Formulartyp oder Produktkategorie kennt die Website bereits, sie sollte sie per dataLayer übergeben, statt dass ein Skript sie mühsam aus der Seite liest. Der dataLayer ist eine Datenschicht, über die die Website Informationen strukturiert an den GTM meldet. Was gar nicht im Browser laufen muss, kann in einen Server-Container wandern, mehr dazu im Ratgeber zu Server-side Tagging. Synchrone Requests haben in einem Tag nichts zu suchen.

Nächster Schritt

Diese Punkte können Sie selbst prüfen:

  • Anzahl: Wie viele Custom HTML Tags enthält Ihr Container, und weiß jemand, was jedes davon tut?
  • Vorlagen: Gibt es für einzelne Custom HTML Tags inzwischen ein fertiges Tag oder eine Vorlage?
  • Long Tasks: Taucht gtm.js im Performance-Tab bei Long Tasks auf?
  • Datenquelle: Liest ein Skript Werte aus der Seite, die die Website auch per dataLayer liefern könnte?

Wenn Sie Ihren Container gemeinsam mit mir auf solche Bremsen prüfen wollen, können Sie ein Erstgespräch buchen.

Dieser Beitrag ist keine Rechtsberatung. Benjamin Juling ist kein Rechtsexperte für Datenschutz. Wir empfehlen, die Umsetzung vor dem Einsatz mit einem Datenschutz-Experten oder einem Datenschutz-Anwalt zu prüfen.