Interaction to Next Paint (INP) as Core Web Vital KPI


INP as Core Web Vital measured value

The Core Web Vitals metric INP (Interaction to Next Paint) was until recently (until May 10, 2023) still an experimental metric, which is now already displayed in the Google PageSpeed Insights check. The new KPI will officially replace the FID (First Input Delay) KPI as part of the Core Web Vitals from March 2024. Until then, it is treated as a pending metric. This means that it has already been tested and is ready to replace FID, but is not yet included in the score.

What is measured with Interaction to Next Paint?

The key figure Interaction to Next Paint measures the responsiveness of the page for all user interactions with it. Low latency when using a website is desirable for a good user experience. All response times are summarized in the INP key figure. The INP value for a page is the longest interaction measured in each case.

Examples of user interactions

The result of interaction with the page is always visual feedback. In online stores, a small number on the shopping cart often indicates whether the item has really been added. Another example is clicking on the frequently used burger menu (3 bars on top of each other) as mobile navigation or opening and closing an accordion navigation (pop-up mechanism).

What can cause a poor INP value?

For example, slow response of the website to clicks by users on certain elements of the page or a contact form, which, for example, through real-time data validation of the user input, ensures that it only reacts slowly to clicks or keystrokes. For the user, this gives the impression that the page is not responding, which in turn leads to a poor user experience.

Why don't I see the metric in my Google PageSpeed Insights measurement?

The measured value can only be collected via the accesses of real users within the last 28 days. For this reason, the new KPI is only displayed if sufficient field data (user data as a history report) is already available for the URL.

Other causes may be:

  • No user actions
  • Interaction with the page using gestures (gesture control)
  • Bot accesses (e.g. crawlers) that do not interact with the page

The KPI is currently not displayed within the laboratory data (current measurement/query). The best way to measure is with real user data, but you can also measure INP data with Lighthouse in Chrome Dev Tools or with the Web Vitals extension for the Chrome browser.

INP in the Google Search Console

INP data has now also been integrated into the Core Web Vital report of the Google Search Console. This means that you can already retrieve the relevant URLs where there are problems with this value.

How does INP differ from FID (First Input Delay)?

INP measures all page interactions and FID only takes into account the first interaction with the page and also only the input delay, not the execution time and result display of the next frame. FID only measures the first impression the user has when using the site, so to speak, while INP measures the general responsiveness.

How is INP measured?

The Event Timing API is used to collect data. The interface is used to measure the latency both before and after the page is loaded. This is part of the Google Chrome browser. The users of the browser thus provide the necessary data. If there are fewer than 50 interactions during a visit to a page, the interaction with the highest latency is used. For more interactions, Google uses the 98th percentile of latencies.

The measurement always starts when the user begins the action. The measurement ends as soon as the first visual feedback is visible on the page.

These actions are measured in concrete terms:

  • Mouse clicks
  • Touch input via touchscreens
  • Keyboard inputs (physical keyboard and screen)

The laboratory data for the optimization of the INP can be measured using a RUM tool (Real User Monitoring). It is important here that not only the INP value itself is displayed, but also the context data (including the input method) for the user interactions in order to be able to make a statement about the causative elements.

What is a good INP value?

  • A low INP < 200 ms is the target and is therefore considered a good latency. To ensure that this goal is met for most users, a good threshold to measure is the 75th percentile of page load times segmented by mobile and desktop devices.
  • An INP above 200 ms but less than 500 ms means that the responsiveness of the page needs to be improved.
  • An INP value above 500 ms indicates that the page reacts poorly to user interactions.

What optimization measures are there for Interaction to Next Paint?

Basically, it is very important that the user always receives very quick visual feedback that their action on the page has led to a certain result or that something is happening as a result of their action.

If there is field data in the Google Search Console or in the PageSpeed Insights Report that indicates a high INP value, optimization is required.

An optimized HTML DOM with as few elements and nesting as possible also ensures fast rendering of the page and thus has a positive influence on the INP.

For websites with many interactive elements, improving the INP is a longer process and it can be difficult to identify which interaction leads to a poor user experience.

Example for optimizing an accordion navigation:

  • Linking of the entire element so that the user does not have to hit the plus sign to expand or the headline to make the content of the accordion visible.
  • Fast unfolding instead of slow sliding.

Long Animation Frames (LoAF) API

To improve a bad INP score, you can use the new Google Chrome LoAF API. 

The API makes it possible for developers to quickly, easily and very precisely obtain information about which files are the cause of the poor user experience. This allows you to find out whether your own or external files need to be optimized and whether they are JavaScript files or other resources.

With the help of the LoAF API, the user experience can therefore be greatly improved with new information.

What changes when you use the Google Page Speed Insights API?

If you use the Google Page Speed Insights API, you will now also receive the identical measured value with a different name. INTERACTION_TO_NEXT_PAINT instead of EXPERIMENTAL_INTERACTION_TO_NEXT_PAINT. The attribute EXPERIMENTAL_INTERACTION_TO_NEXT_PAINT will then be removed from the response for API queries on August 8, 2023.

Christian Schreiber
Christian Schreiber
I have been working as an SEO consultant with a technical focus since 2009. As a qualified business IT specialist and web developer, I support marketing specialists and programmers from start-ups, medium-sized companies, corporations and agencies in the implementation of load time optimisation for high-performance websites.