💨 Total Blocking Time (TBT) i Speed Index: Jak mierzyć i redukować opóźnienia w ładowaniu?

Total Blocking Time (TBT) i Speed Index to kluczowe wskaźniki wydajności dostarczane w sekcji danych laboratoryjnych przez Google PageSpeed Insights. O ile TBT jest ściśle powiązane z interaktywnością (i pośrednio z FID), o tyle Speed Index wizualnie mierzy, jak szybko treść strony staje się widoczna dla użytkownika. Zrozumienie i redukowanie tych opóźnień jest krytyczne dla osiągnięcia wysokiego wyniku ogólnego.

1. 🛑 Total Blocking Time (TBT) – Miernik Interaktywności

TBT mierzy całkowity czas, w którym główny wątek przeglądarki jest zablokowany i nie może przetwarzać danych wejściowych od użytkownika (np. kliknięć), co ma miejsce w trakcie przetwarzania dużych zadań JavaScript.

1.1. Wpływ na FID

**Zastępuje FID:** W danych laboratoryjnych TBT jest kluczowym zastępnikiem dla FID (First Input Delay). Wysoki TBT oznacza, że główny wątek jest zajęty, co z dużym prawdopodobieństwem spowodowałoby wysoki FID w rzeczywistych warunkach. **Cel:** Im niższy TBT, tym lepsza interaktywność. Warto dążyć do wartości poniżej **200-300 milisekund**. **Redukcja:** Główne działanie to redukcja i optymalizacja JavaScriptu (np. code splitting, ładowanie asynchroniczne).

2. 🚀 Speed Index – Wizualna Szybkość

Speed Index jest metryką, która mierzy, jak szybko wizualnie treść jest wyświetlana na stronie podczas ładowania. Jest to wynik uśredniający czas, w którym elementy są rysowane na ekranie.

2.1. Wpływ na Odczucie Szybkości

**Co Mierzy:** Speed Index to bardziej holistyczny wskaźnik wizualnej szybkości niż samo LCP, ponieważ uwzględnia wszystkie elementy pojawiające się w ciągu pierwszych sekund ładowania. **Cel:** Niższa wartość jest lepsza. Wiele narzędzi dąży do wyniku poniżej **3.4 sekundy**. **Redukcja:** Poprawa TTFB, FCP i optymalizacja kolejności ładowania zasobów (eliminacja CSS i JS blokujących renderowanie) bezpośrednio wpływają na obniżenie Speed Index.

3. 🛠️ Wykorzystanie w Audycie PSI

W raporcie Google PageSpeed Insights, TBT i Speed Index są niezbędne w sekcji diagnostycznej.

**TBT w Diagnostyce:** Sekcja "Eliminate render-blocking resources" i "Reduce JavaScript execution time" bezpośrednio pomaga w obniżeniu TBT. **Speed Index i FCP:** Szybka poprawa FCP (First Contentful Paint) oraz optymalizacja największego elementu (LCP) automatycznie obniżają Speed Index.

Podsumowanie: Szybkość i Reakcja

TBT i Speed Index to potężne narzędzia diagnostyczne dostępne w Google PageSpeed Insights. Koncentracja na ich redukcji, głównie poprzez optymalizację JavaScriptu i kolejności ładowania, zapewnia nie tylko lepsze wyniki w Lab Data, ale także znacząco poprawia wrażenia użytkownika, sprawiając, że strona wydaje się nie tylko szybsza, ale i bardziej responsywna.

Autor: Proboost