Five Myths About Next Paint’s Interaction (INP)

Table of Contents

One Core Web Vital indicator that affects Google search rankings is Interaction to Next Paint (INP). Some myths concerning INP surface when web developers and website owners strive to optimize their sites.

Such myths are cleared up in this article, which also offers precise instructions on how INP operates.

Are there any misunderstandings regarding INP?

INP has a lot of documentation. For some typical user activities, it’s usually easy to comprehend how INP functions, especially when testing locally: When you select “add to cart,” a new product is added to the cart. The INP is the interval of time between your click and the cart update.

  • Why does an interaction that looks simple have such a high INP? On my local PC, it functions without a hitch.
  • Why is the user’s click on a paragraph element indicated by this slow INP score? It is not associated with any event listeners!
  • All of the code on my website has been profiled, and it functions flawlessly even on older hardware. Why does INP remain high?

Among the questions we aimed to address in this article are these ones.

Myth 1: In order for INP to function, visual updates are needed.

Some people believe that INP waits for the interaction’s visual update. Although it frequently happens after an interaction, a visual update is not necessary for INP assessment.

The Real Story of Visual Updates and INP

INP measures interaction delays without the need for visual updates, in contrast to the “next paint” in its name.

Regardless of visual changes, INP measures the interval between a user engagement and the subsequent frame render. Rendering opportunities are more important than UI visual adjustments.

To find out more about the interactions that can cause INP, you can experiment with this Interaction to Next Paint playground. For instance, even though there is no visible update required in response to the click/tap interaction, you can click or tap on the header and see that an INP score is still reported.

How to improve slow INP scores in situations when a visual update isn’t expected

It is possible that slow main thread jobs are preventing the next frame render if you are experiencing slow INP scores for interactions that don’t require visual updates. In this situation, your goal should be to enhance INP scores by following the guidelines mentioned in total blocking time:

To determine which main thread activity is taking place during the user interaction, record a DevTools Performance profile.

Concentrate on streamlining the primary thread task that is generating the lag. This can entail dividing up protracted activities or shifting client-side operations to the server.

Share:

Facebook
Twitter
Pinterest
LinkedIn
On Key

Related Posts