Interaction to Next Paint (INP)

Interaction to Next Paint: jak długo strona widocznie odpowiada na dotknięcie albo kliknięcie. Dobrze to poniżej 200 ms.

• Pomoc

Interaction to Next Paint mierzy responsywność: czas od dotknięcia, kliknięcia lub naciśnięcia klawisza do klatki, w której przeglądarka pokazuje reakcję. Raportowana wartość to w przybliżeniu najwolniejsza interakcja w trakcie wizyty, więc jedno ociężałe menu czy filtr wystarczy, by ją zepsuć. W marcu 2024 roku INP zastąpił First Input Delay w zestawie Core Web Vitals.

Progi i skąd bierze się liczba

Do 200 ms — dobrze, do 500 ms — wymaga poprawy, więcej — słabo; według tych granic SiteScan koloruje wiersz. INP da się zmierzyć tylko na prawdziwych interakcjach, dlatego pojawia się wyłącznie w wierszach prawdziwych użytkowników z Chrome UX Report — jako 75. percentyl z ostatnich 28 dni. Witryna bez wystarczającego ruchu z Chrome nie ma wartości INP w ogóle; najbliższą wskazówką laboratoryjną jest Total Blocking Time w wierszach Lighthouse, który SiteScan uznaje za dobry do 200 ms.

Jak poprawić

Niemal zawsze przyczyną jest główny wątek zajęty JavaScriptem.

• Długie zadania warto dzielić i oddawać sterowanie przeglądarce między fragmentami, np. przez await scheduler.yield() lub setTimeout.
• Najpierw pokazać wizualną odpowiedź, a ciężką pracę wykonać potem.
• Wysyłać mniej JavaScriptu: usunąć nieużywane biblioteki, a skrypty firm trzecich ładować później.
• Unikać ogromnego DOM, przez który każde przerysowanie jest kosztowne.