[Resolved] Interaction to next Paint (INP)

[Kathrin]

Hi, today I have recognized that Google rolled out a new metric in page speed insights: Interaction to Next Paint. Unfortunately my website doesn’t pass that metric and the score is very poor 524 ms. I have tried to find out the problem causing that issue with Chrome Canary but I can’t find the option show paint rectangles and the connected timeline. Now I have activated the function paint flashing and every time I scroll through the webpage there are many, many areas highlited in green. Maybe you can help me a bit to find out what is causing that high score?

For example: https://www.topfgartenwelt.com/tomaten-im-topf-tomatensorten-tipps

Link to Page Speed Insights: https://pagespeed.web.dev/report?url=https%3A%2F%2Fwww.topfgartenwelt.com%2Ftomaten-im-topf-tomatensorten-tipps&form_factor=mobile

Thank you very much!

Greetings Kathrin

[David]

Hi there,

INP is based upon the time between a user interacting with the page, and the browser repainting the page to show the interaction occurred.

A good example: User Clicks Hamburger Toggle — time passes as browser does stuff –> Browser repaints page with Menu Open.
Note: Scrolling the page does NOT count as a user interaction.

Anything the browser has to do between the user interaction and repainting the screen is going to be the major factor here.
Measuring that can be tricky, you can record the performance of network activity to see what ‘events’ occur after an interaction.

The most likely culprit will be any optimizations that delaying the loading of scripts until the user interacts with the page.

NOTE: INP is still an experimental metric, therefore it won’t be a ranking factor, ands algorithms will probably change over time.

[Kathrin]

Hi David, thank you very much for the detailled information. I think my cookie consent is delayed until user interaction. But the hint concerning the delayed scripts is really helpful!

Thank you very much!

Greetings Kathrin

[David]

You’re welcome

[Author]

Posts