INP (Interaction to Next Paint) mierzy opóźnienie między interakcją użytkownika (kliknięciem, stuknięciem, naciśnięciem klawisza) a następną aktualizacją obrazu. Dobry wynik to nie więcej niż 200 milisekund. W marcu 2024 roku zastąpił wskaźnik FID.
Co pogarsza INP?
- długie zadania JavaScript blokujące główny wątek,
- duże drzewo DOM,
- ciężkie skrypty zewnętrzne (reklamy, czaty, tagi),
- kosztowna hydratacja.
Jak poprawić INP?
Dziel długie zadania, odkładaj niekrytyczny kod, ogranicz skrypty zewnętrzne i upraszczaj obsługę zdarzeń. Interakcje można profilować w zakładce Performance narzędzi deweloperskich.
Jak mierzyć i szukać winowajców
Raport Core Web Vitals w Search Console pokazuje grupy stron z wolnymi interakcjami, a w Chrome DevTools profilowanie zakładki Performance wskazuje, które zadania i skrypty trwają najdłużej. Biblioteka web-vitals z atrybucją loguje, który element i która faza (opóźnienie, przetwarzanie, prezentacja) odpowiada za wynik. Często problemem są tagi analityczne, czaty i karuzele.
Czym INP różni się od FID?
FID mierzył tylko opóźnienie pierwszej interakcji. INP uwzględnia wszystkie interakcje w trakcie wizyty i raportuje jedną z najgorszych.
Zobacz w praktyce
Refaktoryzacja JavaScript – jak poprawić Interaction to Next Paint (INP)
Płynne przewijanie i animacje w JavaScript – jak usunąć zacinanie strony
Jak zmniejszyć rozmiar DOM i przyspieszyć stronę