Opublikowano: 29 lipca 2021 r.
Tagi to fragmenty kodu firmy zewnętrznej, które są wstawiane do witryny, zwykle za pomocą menedżera tagów. Tagi są najczęściej używane do celów marketingowych i analitycznych.
Wpływ tagów i menedżerów tagów na wydajność różni się znacznie w zależności od witryny. Menedżery tagów można porównać do koperty: menedżer tagów zapewnia naczynie, ale to, czym je wypełnisz i jak go użyjesz, zależy głównie od Ciebie.
W tym artykule omawiamy techniki optymalizacji tagów i menedżerów tagów pod kątem wydajności i wskaźników Core Web Vitals. Chociaż w tym dokumencie mowa jest o Menedżerze tagów Google, wiele z omawianych pomysłów można zastosować do innych menedżerów tagów.
Wpływ na Core Web Vitals
Menedżery tagów mogą często pośrednio wpływać na Core Web Vitals, zużywając zasoby potrzebne do szybkiego wczytywania strony i utrzymania jej responsywności. Przepustowość może być wykorzystywana na pobieranie kodu JavaScript Menedżera tagów dla Twoich witryn lub na kolejne wywołania, które on wykonuje. Czas pracy procesora w głównym wątku może być poświęcony na ocenę i wykonywanie kodu JavaScript zawartego w Menedżerze tagów i tagach.
Największe wyrenderowanie treści (LCP) jest podatne na rywalizację o przepustowość w krytycznym czasie wczytywania strony. Dodatkowo blokowanie głównego wątku może opóźnić czas renderowania LCP.
Na skumulowane przesunięcie układu (CLS) może wpływać opóźnienie ładowania zasobów krytycznych przed pierwszym renderowaniem lub wstrzykiwanie treści na stronę przez menedżery tagów.
Interakcja do kolejnego wyrenderowania (INP) jest podatna na rywalizację o zasoby procesora w głównym wątku. Zaobserwowaliśmy korelację między rozmiarem menedżerów tagów a gorszymi wynikami INP.
Wybór odpowiedniego typu tagu
Wpływ tagów na skuteczność zależy od ich typu. Ogólnie rzecz biorąc, tagi graficzne („piksele”) są najbardziej wydajne, następnie szablony niestandardowe, a na końcu niestandardowe tagi HTML. Tagi dostawców różnią się w zależności od funkcji, które umożliwiają.
Pamiętaj, że sposób użycia tagu ma duży wpływ na jego wydajność. „Piksele” są bardzo wydajne, głównie dlatego, że charakter tego typu tagu nakłada ścisłe ograniczenia na sposób ich użycia. Niestandardowe tagi HTML nie zawsze mają negatywny wpływ na wydajność, ale ze względu na poziom swobody, jaki oferują użytkownikom, można je łatwo wykorzystać w sposób, który negatywnie wpływa na wydajność.
Myśląc o tagach, pamiętaj o skali: wpływ pojedynczego tagu na wydajność może być znikomy, ale może stać się znaczący, gdy na tej samej stronie używasz dziesiątek lub setek tagów.
Nie wszystkie skrypty powinny być wczytywane za pomocą menedżera tagów
Menedżery tagów zwykle nie są najlepszym sposobem na wczytywanie zasobów, które implementują natychmiastowe aspekty wizualne lub funkcjonalne, takie jak powiadomienia o plikach cookie, banery powitalne czy funkcje witryny. Użycie menedżera tagów do wczytywania tych zasobów zwykle opóźnia ich dostarczanie. Jest to niekorzystne dla użytkowników i może też zwiększać wartości wskaźników takich jak LCP i CLS.
Dodatkowo niektórzy użytkownicy blokują menedżery tagów. Użycie menedżera tagów do wdrożenia funkcji UX może spowodować, że witryna nie będzie działać u niektórych użytkowników.
Zachowaj ostrożność przy niestandardowych tagach HTML
Niestandardowe tagi HTML są dostępne od wielu lat i są powszechnie używane w większości witryn. Niestandardowe tagi HTML umożliwiają wprowadzanie własnego kodu z niewielkimi ograniczeniami, ponieważ mimo nazwy głównym zastosowaniem tego tagu jest dodawanie do strony niestandardowych elementów <script>.
Niestandardowe tagi HTML mogą być używane na wiele różnych sposobów, a ich wpływ na skuteczność może się znacznie różnić. Podczas pomiaru skuteczności witryny pamiętaj, że większość narzędzi przypisuje wpływ niestandardowego tagu HTML na skuteczność do menedżera tagów, który go wstrzyknął, a nie do samego tagu.
Niestandardowe tagi HTML mogą wstawiać elementy na stronie, na której się znajdują. Wstawianie elementów na stronie może powodować problemy z wydajnością, a w niektórych przypadkach także przesunięcia układu.
- W większości przypadków, gdy element jest wstawiany na stronę, przeglądarka musi ponownie obliczyć rozmiar i położenie każdego elementu na stronie. Ten proces nazywa się układem. Wpływ pojedynczego układu na wydajność jest minimalny, ale gdy występuje on zbyt często, może stać się źródłem problemów z wydajnością. Wpływ tego zjawiska jest większy na urządzeniach niższej klasy i na stronach z dużą liczbą elementów DOM.
- Jeśli widoczny element strony zostanie wstawiony do DOM po wyrenderowaniu otaczającego go obszaru, może to spowodować przesunięcie układu. To zjawisko nie jest unikalne dla menedżerów tagów, ale ponieważ tagi zwykle ładują się później niż inne części strony, często są wstawiane do DOM po wyrenderowaniu otaczającej strony.
Używanie szablonów niestandardowych
Szablony niestandardowe obsługują niektóre z tych samych operacji co niestandardowe tagi HTML, ale są oparte na wersji JavaScriptu działającej w środowisku typu sandbox, która udostępnia interfejsy API do typowych zastosowań, takich jak wstrzykiwanie skryptów i pikseli. Jak sama nazwa wskazuje, umożliwiają one utworzenie szablonu przez doświadczonego użytkownika, który może go utworzyć z myślą o wydajności. Użytkownicy, którzy nie mają wiedzy technicznej, mogą następnie użyć tego szablonu. Jest to często bezpieczniejsze niż zapewnianie pełnego dostępu do niestandardowego kodu HTML.
Ze względu na większe ograniczenia nałożone na szablony niestandardowe te tagi są znacznie mniej podatne na problemy z wydajnością lub bezpieczeństwem. Z tych samych powodów szablony niestandardowe nie sprawdzają się we wszystkich przypadkach użycia.
Prawidłowe wstrzykiwanie skryptów
Wstrzykiwanie skryptu za pomocą menedżera tagów to bardzo częsty przypadek użycia. Zalecanym sposobem jest użycie szablonu niestandardowego i interfejsu API injectScript.
Informacje o używaniu interfejsu injectScript API do konwertowania istniejącego niestandardowego tagu HTML znajdziesz w sekcji Konwertowanie istniejącego tagu.
Jeśli musisz użyć niestandardowego tagu HTML, pamiętaj:
- Biblioteki i duże skrypty innych firm powinny być wczytywane za pomocą tagu skryptu (np.
<script src="external-scripts.js">), który pobiera plik zewnętrzny, a nie przez bezpośrednie kopiowanie i wklejanie zawartości skryptu do tagu. Chociaż rezygnacja z używania tagu<script>eliminuje osobne żądanie w obie strony w celu pobrania zawartości skryptu, zwiększa to rozmiar kontenera i uniemożliwia osobne zapisywanie skryptu w pamięci podręcznej przeglądarki. - Wielu dostawców zaleca umieszczanie tagu
<script>w górnej części elementu<head>. W przypadku skryptów wczytywanych za pomocą Menedżera tagów jest to jednak często niepotrzebne. W większości przypadków przeglądarka kończy analizowanie elementu<head>, zanim Menedżer tagów zostanie uruchomiony.
Używanie pikseli
Czasami skrypty innych firm można zastąpić pikselami obrazu lub elementu iframe. W porównaniu ze skryptami piksele mogą obsługiwać mniej funkcji, dlatego często są uważane za mniej preferowaną implementację. Jednak gdy są używane w menedżerach tagów, piksele mogą być bardziej dynamiczne, ponieważ mogą być uruchamiane przez reguły i przekazywać różne zmienne.
Piksele to najbardziej wydajny i bezpieczny typ tagu, ponieważ po jego uruchomieniu nie jest wykonywany kod JavaScript. Piksele mają bardzo mały rozmiar zasobu (mniej niż 1 KB) i nie powodują przesunięć układu.
Aby dowiedzieć się więcej o obsłudze pikseli, skontaktuj się z zewnętrznym dostawcą. Możesz też sprawdzić, czy w kodzie znajduje się tag <noscript>.
Jeśli dostawca obsługuje piksele, często umieszcza je w tagu <noscript>.
Alternatywy dla pikseli
Piksele stały się popularne głównie dlatego, że w pewnym momencie były jednym z najtańszych i najbardziej niezawodnych sposobów na wysyłanie żądań HTTP w sytuacjach, gdy odpowiedź serwera nie jest istotna ( np. podczas wysyłania danych do dostawców usług analitycznych). Interfejsy API navigator.sendBeacon() i fetch() keepalive zostały zaprojektowane z myślą o tym samym zastosowaniu, ale są prawdopodobnie bardziej niezawodne niż piksele.
Nie ma nic złego w dalszym używaniu pikseli – są one dobrze obsługiwane i mają minimalny wpływ na wydajność. Jeśli jednak tworzysz własne sygnały, warto rozważyć użycie jednego z tych interfejsów API.
sendBeacon()
Interfejs API navigator.sendBeacon() jest przeznaczony do wysyłania niewielkich ilości danych do serwerów WWW w sytuacjach, gdy odpowiedź serwera nie ma znaczenia.
const url = "https://example.com/analytics";
const data = JSON.stringify({
event: "checkout",
time: performance.now()
});
navigator.sendBeacon(url, data);
sendBeacon() ma ograniczony interfejs API: obsługuje tylko żądania POST i nie obsługuje ustawiania niestandardowych nagłówków. Jest on obsługiwany przez wszystkie nowoczesne przeglądarki.
Fetch API keepalive
keepalive to flaga, która umożliwia używanie interfejsu Fetch API do wysyłania żądań nieblokujących, takich jak raportowanie zdarzeń i statystyki. Aby go użyć, dodaj keepalive: true do parametrów przekazywanych do fetch().
const url = "https://example.com/analytics";
const data = JSON.stringify({
event: "checkout",
time: performance.now()
});
fetch(url, {
method: 'POST',
body: data,
keepalive: true
});
Jeśli fetch() keepalive i sendBeacon() wydają się bardzo podobne, to dlatego, że tak jest. W przeglądarkach Chromium sendBeacon() jest teraz oparty na fetch()
keepalive.
Wybierając między fetch() keepalive a sendBeacon(), weź pod uwagę funkcje i obsługę przeglądarki, których potrzebujesz. Interfejs API fetch() jest znacznie bardziej elastyczny, ale keepalive ma mniejsze wsparcie przeglądarek niż sendBeacon().
Jak działają tagi
Tagi są często tworzone zgodnie ze wskazówkami dostarczonymi przez zewnętrznego dostawcę. Jeśli nie masz pewności, co robi kod dostawcy, zapytaj kogoś, kto wie. Dzięki temu możesz sprawdzić, czy tag może powodować problemy z wydajnością lub bezpieczeństwem.
Zalecamy oznaczenie tagów w menedżerze tagów etykietą z nazwą właściciela. Łatwo zapomnieć, kto jest właścicielem tagu, co może prowadzić do obaw przed jego usunięciem, aby niczego nie zepsuć.
Aktywatory
Ogólnie rzecz biorąc, optymalizacja reguł tagów polega na tym, aby nie uruchamiać tagów częściej, niż jest to konieczne, i wybrać regułę, która zapewnia równowagę między potrzebami biznesowymi a kosztami związanymi z wydajnością.
Reguły to kod JavaScript, który zwiększa rozmiar i koszt wykonania Menedżera tagów. Większość czynników wywołujących jest niewielka, ale ich efekt może się kumulować. Na przykład kilka zdarzeń kliknięcia lub reguł minutnika może znacznie zwiększyć obciążenie Menedżera tagów.
Wybierz odpowiednie zdarzenie wywołujące.
Wpływ tagu na wydajność może być różny. Ogólnie rzecz biorąc, im wcześniej tag się uruchamia, tym większy ma wpływ na wydajność. Zasoby są zwykle ograniczone podczas początkowego wczytywania strony, dlatego wczytywanie lub wykonywanie określonego zasobu (lub tagu) odbiera zasoby innym elementom.
Wybór odpowiednich reguł jest ważny w przypadku wszystkich tagów, ale ma szczególne znaczenie w przypadku tagów, które wczytują duże zasoby lub wykonują długie skrypty.
Tagi mogą być uruchamiane przez wyświetlenia strony (zwykle Page load, DOM Ready, Window Loaded) lub na podstawie zdarzenia niestandardowego. Aby uniknąć wpływu na wczytywanie strony, uruchamiaj mniej ważne tagi po zdarzeniu Window Loaded.
Używanie zdarzeń niestandardowych
Używaj zdarzeń niestandardowych, aby uruchamiać reguły w odpowiedzi na zdarzenia na stronie, które nie są obsługiwane przez wbudowane reguły Menedżera tagów Google. Na przykład wiele tagów używa reguł wyświetlenia strony. Jednak czas między DOM Ready a Window Loaded może być długi, co utrudnia precyzyjne określenie momentu uruchomienia tagu. Rozwiązaniem tego problemu mogą być
zdarzenia niestandardowe.
Najpierw utwórz regułę zdarzenia niestandardowego i zaktualizuj tagi, aby jej używały.
Aby uruchomić regułę, prześlij odpowiednie zdarzenie do warstwy danych.
// Custom event trigger that fires after 2 seconds
setTimeout(() => {
dataLayer.push({
'event' : 'my-custom-event'
});
}, 2000);
Używanie konkretnych warunków aktywacji
Określ konkretne warunki reguł, aby uniknąć niepotrzebnego uruchamiania tagów. Jednym z najprostszych i najskuteczniejszych sposobów jest upewnienie się, że tag uruchamia się tylko na stronach, na których jest faktycznie używany.
Zmienne wbudowane można uwzględniać w warunkach reguł, aby ograniczać uruchamianie tagów.
Wczytywanie menedżera tagów w odpowiednim momencie
Możesz zwiększyć skuteczność, dostosowując moment wczytywania samego menedżera tagów. Aktywatory, niezależnie od konfiguracji, nie mogą się uruchomić, dopóki nie wczyta się Menedżer tagów. Eksperymentuj z momentem wczytywania menedżera tagów, ponieważ może to mieć taki sam lub większy wpływ. Ta decyzja ma wpływ na wszystkie tagi na stronie.
Późniejsze wczytywanie menedżera tagów pozwala uniknąć problemów z wydajnością w przyszłości, ponieważ zapobiega przypadkowemu zbyt wczesnemu wczytaniu tagu.
Zmienne
Używaj zmiennych do odczytywania danych ze strony. Są przydatne w regułach i tagach.
Podobnie jak reguły, zmienne dodają kod JavaScript do menedżera tagów, co może powodować problemy z wydajnością. Zmienne mogą być stosunkowo niewielkie, np. kod do odczytu części adresu URL, plików cookie, warstwy danych lub interfejsu DOM. Mogą też zawierać niestandardowy kod JavaScript o nieograniczonych możliwościach (i rozmiarze).
Ogranicz użycie zmiennych do minimum, ponieważ są one stale oceniane przez Menedżera tagów. Usuń stare zmienne, które nie są już używane, aby zmniejszyć rozmiar skryptu Menedżera tagów i skrócić czas jego przetwarzania.
Zarządzanie tagami
Efektywne używanie tagów zmniejsza ryzyko wystąpienia problemów z wydajnością.
Korzystanie z warstwy danych
Warstwa danych to tablica w Javascripcie obiektów, która zawiera informacje o stronie. Te obiekty zawierają wszystkie informacje, które chcesz przekazać do Menedżera tagów Google.
Warstwy danych można też używać do uruchamiania tagów.
// Contents of the data layer
window.dataLayer = [{
'pageCategory': 'signup',
'visitorType': 'high-value'
}];
// Pushing a variable to the data layer
window.dataLayer.push({'variable_name': 'variable_value'});
// Pushing an event to the data layer
window.dataLayer.push({'event': 'event_name'});
Chociaż Menedżera tagów Google można używać bez warstwy danych, zdecydowanie zalecamy jej stosowanie. Warstwa danych konsoliduje dane, do których mogą uzyskiwać dostęp skrypty innych firm, w jednym miejscu, co zapewnia lepszy wgląd w ich wykorzystanie. Może to m.in. pomóc ograniczyć zbędne obliczenia zmiennych i wykonywanie skryptów.
Dzięki warstwie danych możesz kontrolować, do jakich danych mają dostęp tagi, zamiast przyznawać im pełny dostęp do zmiennych JavaScriptu lub DOM.
Korzyści związane z wydajnością warstwy danych mogą nie być intuicyjne, ponieważ aktualizacja warstwy danych powoduje, że Menedżer tagów Google ponownie ocenia wszystkie zmienne kontenera i potencjalnie uruchamia tagi, co wiąże się z wykonywaniem kodu JavaScript. Chociaż możliwe jest niewłaściwe użycie warstwy danych, ogólnie rzecz biorąc, jeśli warstwa danych wydaje się być źródłem problemów z wydajnością, prawdopodobnie problemy te występują w samym kontenerze. Warstwa danych sprawia, że te problemy są bardziej widoczne.
Usuwanie zduplikowanych i nieużywanych tagów
Zduplikowane tagi mogą występować, gdy tag jest zawarty w znacznikach HTML strony, a dodatkowo jest wstrzykiwany przez menedżera tagów.
Nieużywane tagi należy wstrzymać lub usunąć, a nie blokować za pomocą wyjątku reguły. Wstrzymanie lub usunięcie tagu powoduje usunięcie kodu z kontenera, ale zablokowanie już nie.
Po usunięciu nieużywanych tagów sprawdź reguły i zmienne, aby ustalić, czy je też można usunąć.
Wstrzymane tagi wpływają na rozmiar kontenera, ale łączny ładunek jest mniejszy niż w przypadku aktywnych tagów.
Korzystanie z list dozwolonych i odrzuconych
Użyj list dozwolonych i niedozwolonych, aby skonfigurować bardzo szczegółowe ograniczenia dotyczące tagów, reguł i zmiennych dozwolonych na stronie. Można go używać do egzekwowania sprawdzonych metod dotyczących wydajności i innych zasad.
Listy dozwolonych i niedozwolonych są konfigurowane za pomocą warstwy danych.
window.dataLayer = [{
'gtm.allowlist': ['<id>', '<id>', ...],
'gtm.blocklist': ['customScripts']
}];
Możesz na przykład uniemożliwić używanie niestandardowych tagów HTML, zmiennych JavaScript lub bezpośredniego dostępu do modelu DOM. Oznacza to, że można używać tylko pikseli i wstępnie zdefiniowanych tagów z danymi z warstwy danych. Chociaż jest to restrykcyjne, może prowadzić do wydajniejszego i bezpieczniejszego wdrożenia Menedżera tagów.
Rozważ użycie tagowania po stronie serwera
Warto rozważyć przejście na tagowanie po stronie serwera, zwłaszcza w przypadku większych witryn, które chcą mieć większą kontrolę nad swoimi danymi. Tagowanie po stronie serwera usuwa kod dostawcy z klienta, a tym samym przenosi przetwarzanie z klienta na serwer.
Na przykład w przypadku tagowania po stronie klienta wysyłanie danych na wiele kont Analytics wymaga, aby klient inicjował osobne żądania dla każdego punktu końcowego. W przypadku tagowania po stronie serwera klient wysyła do kontenera po stronie serwera jedno żądanie, a stamtąd dane są przekazywane na różne konta Analytics.
Pamiętaj, że tagowanie po stronie serwera działa tylko z niektórymi tagami. Zgodność tagów różni się w zależności od dostawcy.
Więcej informacji znajdziesz w artykule Wprowadzenie do tagowania po stronie serwera.
Kontenery
Menedżery tagów zwykle umożliwiają skonfigurowanie wielu instancji, często nazywanych kontenerami. Na jednym koncie Menedżera tagów można zarządzać wieloma kontenerami.
Używaj tylko jednego kontenera na stronę.
Wiele kontenerów na jednej stronie może powodować poważne problemy z wydajnością, ponieważ zwiększa obciążenie i liczbę wykonywanych skryptów. W najlepszym przypadku powiela on kod podstawowego tagu, który jest dostarczany jako część kodu JavaScript kontenera i nie może być ponownie użyty w innych kontenerach.
Rzadko zdarza się, aby kilka kontenerów było używanych efektywnie. Są jednak przypadki, w których może to działać, jeśli jest dobrze kontrolowane. Na przykład:
- Obejmuje to lżejszy kontener „wczytywany wcześniej” i cięższy kontener „wczytywany później” zamiast jednego dużego kontenera.
- Używanie kontenera z ograniczeniami dla mniej zaawansowanych technicznie użytkowników i kontenera z mniejszą liczbą ograniczeń, ale ściślej kontrolowanego, w przypadku bardziej złożonych tagów.
Jeśli musisz używać wielu kontenerów na stronie, postępuj zgodnie ze wskazówkami Menedżera tagów Google dotyczącymi konfigurowania wielu kontenerów.
W razie potrzeby używaj osobnych kontenerów
Jeśli używasz menedżera tagów w przypadku wielu usług, np. aplikacji internetowej i aplikacji mobilnej, liczba używanych kontenerów może zwiększyć lub zmniejszyć produktywność Twojego przepływu pracy. Może też mieć niekorzystny wpływ na skuteczność.
Pojedynczego kontenera można skutecznie używać w wielu witrynach, jeśli są one podobne pod względem zastosowania i struktury. Na przykład aplikacje mobilne i internetowe danej marki mogą mieć podobne funkcje, ale prawdopodobnie mają inną strukturę, dlatego skuteczniej można nimi zarządzać za pomocą oddzielnych kontenerów.
Zbyt szerokie wykorzystywanie jednego kontenera może zwiększyć jego złożoność i rozmiar, ponieważ wymusza stosowanie skomplikowanej logiki do zarządzania tagami i regułami.
Monitorowanie rozmiaru kontenera
Rozmiar kontenera zależy od jego tagów, reguł i zmiennych. Mały kontener może mieć negatywny wpływ na wydajność strony, ale duży kontener prawie na pewno będzie go miał.
Rozmiar kontenera nie powinien być najważniejszym wskaźnikiem podczas optymalizacji użycia tagów. Jednak duży rozmiar kontenera jest często sygnałem ostrzegawczym, że kontener nie jest dobrze utrzymywany i może być niewłaściwie używany.
Menedżer tagów Google ogranicza rozmiar kontenera do 300 KB i ostrzega o rozmiarze kontenera, gdy osiągnie on 70% limitu.
Większość witryn powinna dążyć do tego, aby ich kontenery były mniejsze niż limit. Dla porównania: mediana rozmiaru kontenera witryny wynosi około 50 KB. Sama biblioteka Menedżera tagów Google ma po skompresowaniu około 33 KB.
Nazywanie wersji kontenera
Wersja kontenera to zrzut zawartości kontenera w określonym momencie. Użycie zrozumiałej nazwy i dołączenie krótkiego opisu istotnych zmian może znacznie ułatwić debugowanie przyszłych problemów z wydajnością.
Przepływy pracy z tagami
Ważne jest, aby zarządzać zmianami w tagach, tak aby nie miały one negatywnego wpływu na wydajność strony.
Testowanie przed wdrożeniem
Przetestuj tagi przed wdrożeniem, aby wykryć problemy z wydajnością i inne, zanim zostaną wysłane.
Podczas testowania tagu weź pod uwagę te kwestie:
- Czy tag działa prawidłowo?
- Czy tag powoduje przesunięcia układu?
- Czy tag wczytuje jakieś zasoby? Jak duże są te zasoby?
- Czy tag uruchamia długo działający skrypt?
Tryb podglądu
Tryb podglądu umożliwia testowanie zmian tagów w witrynie bez konieczności ich wcześniejszego wdrażania. Tryb podglądu obejmuje konsolę debugowania, która dostarcza informacji o tagach.
Czas wykonywania Menedżera tagów Google jest inny (nieco dłuższy) w trybie podglądu ze względu na dodatkowe obciążenie związane z wyświetlaniem informacji w konsoli debugowania. Dlatego nie zalecamy porównywania pomiarów Web Vitals zebranych w trybie podglądu z pomiarami zebranymi w środowisku produkcyjnym. Ta rozbieżność nie powinna jednak wpływać na działanie samych tagów.
Testowanie samodzielne
Innym sposobem testowania tagów jest skonfigurowanie pustej strony zawierającej kontener z jednym tagiem – tagiem, który testujesz. Taka konfiguracja testowa jest mniej realistyczna i nie wykryje niektórych problemów (np. czy tag powoduje przesunięcia układu), ale może ułatwić wyizolowanie i zmierzenie wpływu tagu na takie elementy jak wykonywanie skryptu. Zobacz, jak Telegraph wykorzystuje to podejście do izolacji, aby poprawić wydajność kodu innych firm.
Monitorowanie skuteczności tagów
Za pomocą interfejsu Monitoring API Menedżera tagów Google możesz zbierać informacje o czasie wykonywania konkretnego tagu. Te informacje są przekazywane do wybranego przez Ciebie punktu końcowego.
Więcej informacji znajdziesz w artykule How to build a Google Tag Manager Monitor (Jak utworzyć monitor Menedżera tagów Google).
Wymagaj zatwierdzania zmian w kontenerze
Kod własny jest zwykle sprawdzany i testowany przed wdrożeniem. Tagi traktuj tak samo.
Jednym ze sposobów jest dodanie weryfikacji dwuetapowej, która wymaga zatwierdzenia zmian w kontenerze przez administratora. Jeśli nie chcesz wymagać weryfikacji dwuetapowej, ale chcesz mieć kontrolę nad zmianami, możesz skonfigurować powiadomienia dotyczące kontenera, aby otrzymywać alerty e-mail o wybranych zdarzeniach w kontenerze.
Okresowe sprawdzanie użycia tagów
Jednym z wyzwań związanych z pracą z tagami jest to, że z czasem mają tendencję do gromadzenia się: tagi są dodawane, ale rzadko usuwane. Jednym ze sposobów na odwrócenie tego trendu jest okresowe sprawdzanie tagów. Idealna częstotliwość zależy od tego, jak często aktualizowane są tagi w witrynie.
Oznaczanie każdego tagu etykietą, która jednoznacznie wskazuje właściciela, ułatwia identyfikację osoby odpowiedzialnej za dany tag i może pomóc w ustaleniu, czy jest on nadal potrzebny.
Podczas sprawdzania tagów pamiętaj o wyczyszczeniu reguł i zmiennych. Często mogą też być przyczyną problemów z wydajnością.
Więcej informacji znajdziesz w artykule Kontrolowanie skryptów innych firm.