Co to jest TBT?
Wskaźnik łącznego czasu blokowania (TBT) mierzy łączny czas po pierwszym wyrenderowaniu treści (FCP), w którym wątek główny był zablokowany na tyle długo, że uniemożliwiało to reagowanie na dane wejściowe.
Lighthouse przestaje monitorować TBT domyślnie po czasie do interakcji (TTI), podobnie jak inne narzędzia laboratoryjne służące do pomiaru czasu ładowania strony. Zapoznaj się z artykułem Jaki jest związek między TBT a TTI?.
Wątek główny jest uważany za „zablokowany” zawsze wtedy, gdy wątek długi działa na wątku głównym przez ponad 50 ms. Mówimy, że wątek główny jest „zablokowany”, ponieważ przeglądarka nie może przerwać trwającego zadania. Jeśli użytkownik w ogóle wejdzie w interakcję ze stroną w środku długiego zadania, przeglądarka musi poczekać na jego zakończenie, zanim będzie mogła zareagować.
Jeśli zadanie jest wystarczająco długie (cokolwiek powyżej 50 ms), użytkownik prawdopodobnie zauważy opóźnienie i potraktuje stronę jako wolną lub uszkodzoną.
Czas blokowania danego długiego zadania to czas jego trwania przekraczający 50 ms. Całkowity czas blokowania strony to suma czasu blokowania dla każdego długiego zadania, które występuje po FCP w okresie pomiaru (zwykle TTI w przypadku narzędzi do wczytywania stron lub łączny czas śledzenia w przypadku innych narzędzi).
Na przykład zwróć uwagę na diagram główny wątek przeglądarki podczas wczytywania strony:
Oś czasu na powyższym obrazku zawiera 5 zadań, z których 3 są długimi zadaniami, ponieważ ich czas trwania przekracza 50 milisekund. Na poniższym diagramie widać czas blokowania dla każdego z długich zadań:
Całkowity czas wykonywania zadań w wątku głównym wynosi 560 ms, ale tylko 345 ms jest uważane za czas blokowania.
| Czas trwania działania (milisekundy) | Czas blokowania zadania (w milisekundach) | |
|---|---|---|
| Zadanie pierwsze | 250 | 200 |
| Drugie zadanie | 90 | 40 |
| Zadanie 3. | 35 | 0 |
| Zadanie 4. | 30 | 0 |
| Zadanie 5 | 155 | 105 |
| Łączny czas blokowania | 345 ms | |
Jaki jest związek między TBT a INP?
TBT jest wcześniejszy niż INP i jest przydatny jako wskaźnik problemów z INP, zwłaszcza w środowisku laboratoryjnym, gdzie pomiar INP jest trudniejszy. Jednak TBT może zgłaszać potencjalne problemy, które w ogóle nie występują, ponieważ użytkownicy nie wchodzą w interaktywność. Może też nie wykrywać problemów spowodowanych przez interakcje, gdy pomiar jest przeprowadzany w środowisku laboratoryjnym. Zalecamy pomiar INP w warunkach rzeczywistych jako wskaźnik rzeczywistych problemów z szybkością działania, z którymi spotykają się użytkownicy. TBT może być odpowiednim wskaźnikiem zastępczym dla INP w przypadku laboratorium, ale nie zastępuje on samego INP.
Jakie jest powiązanie między TBT a TTI?
TBT jest mierzony w danym okresie. W przypadku niektórych narzędzi laboratoryjnych, które tradycyjnie mierzą czas wczytywania strony, m.in. Lighthouse, czas wczytywania strony do momentu, gdy TTI jest mierzalny, jest to czas wczytywania strony do momentu, gdy TTI jest mierzalny, ponieważ pomaga określić, jak długo nieinteraktywna jest strona, zanim znowu stanie się interaktywna w stopniu funkcjonalnym. Czas do interakcji może być jednak mierzony także po wczytaniu strony, czyli po TTI, np. w trybie Timespan w Lighthouse.
TTI uznaje stronę za „bezpiecznie interaktywną”, jeśli w wątku głównym przez co najmniej 5 sekund nie było długich zadań. Oznacza to, że 3 zadania o długości 51 ms rozłożone na 10 sekund mogą wydłużyć TTI tak samo jak jedno 10-sekundowe zadanie, ale te 2 sytuacje będą się bardzo różnić z perspektywy użytkownika próbującego wchodzić w interakcje ze stroną.
W pierwszym przypadku 3 zadania o długości 51 ms miałyby TBT wynoszący 3 ms. Natomiast jedno zadanie trwające 10 sekund miałoby TBT 9950 ms. Większa wartość TBT w drugim przypadku oznacza gorsze wrażenia.
Ten przykład pokazuje, dlaczego TBT jest często lepszym wskaźnikiem niż TTI, ponieważ jest mniej podatny na wartości odstające. Dotyczy to nawet sytuacji, gdy TTI jest używany jako punkt końcowy dla TBT.
Jak mierzyć TBT
TBT to dane, które należy mierzyć w laboratorium. Najlepszym sposobem na pomiar TBT jest przeprowadzenie w witrynie audytu skuteczności Lighthouse. Szczegółowe informacje o korzystaniu z tego narzędzia znajdziesz w dokumentacji Lighthouse na temat TBT.
Czas wczytywania strony można mierzyć w polu, ale nie zalecamy tego, ponieważ interakcja użytkownika może wpływać na czas wczytywania strony w sposób, który powoduje duże rozbieżności w raportach. Jeśli chcesz sprawdzić więcej niż jedną interakcję INP, zalecamy skorzystanie z nowszego interfejsu Long Animations Frame API.
Narzędzia laboratoryjne
Jaki jest dobry wynik TBT?
Aby zapewnić użytkownikom wygodę, witryny powinny mieć łączny czas blokowania poniżej 200 milisekund podczas testowania na przeciętnym sprzęcie mobilnym.
Więcej informacji o tym, jak TBT strony wpływa na wynik skuteczności w Lighthouse, znajdziesz w artykule Jak Lighthouse określa wynik TBT.
Jak poprawić TBT
Ogólnie zalecamy optymalizację pod kątem INP zamiast TBT, ponieważ TBT to dane zastępcze dla INP w laboratorium (gdzie zwykle nie można dokładnie zmierzyć INP). Aby poprawić TBT, zapoznaj się ze wskazówkami dotyczącymi optymalizacji INP.
Jeśli interesuje Cię konkretnie TBT, możesz przeprowadzić audyt wydajności Lighthouse i zwrócić uwagę na konkretne możliwości zasugerowane przez audyt.
Ogólnie rzecz biorąc, poprawa TBT w witrynie polega na zmniejszeniu liczby blokujących skryptów, co oznacza ich optymalizację pod kątem mniejszego blokowania lub ogólne zmniejszenie liczby skryptów. Zapoznaj się z tymi przewodnikami dotyczącymi skuteczności: