30 second summary:
- Good page speed and user experience help your site stand out in search results
- Interaction with Next Paint metric replaces first input delay
- You can improve your site’s response to user input by reducing CPU processing times.
Core Web Vitals are a set of metrics that Google has defined to measure the quality of a website’s user experience. They became a ranking signal for the first time in 2021.
While metric definitions have been modified over timeThe introduction of the Interaction to Next Paint metric is the most significant change since the launch of the Core Web Vitals initiative.
What is interacting with Next Paint (INP)?
Interaction with the next painting is a metric that evaluates how quickly your website responds to user interaction. It measures the time between user input, such as a button click, and the next refresh of the page content (the “next paint”).
For better rankings in Google, this interaction time should be less than 200 milliseconds. This ensures that the website responds to users.
How are Core Web Vitals evolving?
Google announced that Interaction to Next Paint will become one of the three Core Web Vitals metrics in March 2024. At this point, a website that responds too slowly to user inputs could rank worse in search results.
INP will replace the current First Entry Delay (FID). Although FID also measures responsiveness, it is more limited because it only considers the user’s first interaction. It also only measures the delay until the input event begins to be processed, rather than waiting until the user can see the result.
Currently only 64.9% of mobile websites do well on the Interaction to Next Paint metric and it will be harder to get a good INP score than a good First Input Delay score.
How can I measure the Interaction metric with Next Paint on my website?
Run a website speed test to see how quickly your website loads and how quickly it responds to user input.
Open the “Web Vitals” tab once your test is complete. You can see the Interaction with Next Paint metric at the bottom of the page.
In this case, only 38% of users have a good INP experience.
How can I optimize interaction with Next Paint?
Interaction delays occur when the browser has to do a lot of CPU processing before it can update the page. This can happen for two reasons:
- Running background tasks prevent handling of user input
- Managing user input itself takes a lot of time
Background tasks often occur when the page initially loads, but can also occur later. They are often caused by third-party code embedded in the website.
Responding to a user interaction can require a lot of processing. If this cannot be optimized, you might consider displaying an icon to provide visual feedback until the processing task is complete.
Executing JavaScript code is the most common type of processing, but complex visual updates can also take a long time.
Use Chrome DevTools to analyze performance
Chrome developer tools performance profiler shows which tasks take a lot of time and need to be optimized. Start a recording, click an element on the page, and then click the longest bars in the visualization.
This allows you to identify whether the code comes from a third party or your own website. You can also drill down to see how the task can be speeded up.
Check the Total Blocking Time metric to identify background tasks
THE Total blocking time the metric tracks how often background CPU tasks might block the execution of other code. If the user interacts with the page while a task is already in progress, the browser first completes that task before handling the input event.
You can use tools like Google Flagship to see how this metric can be optimized.
If processing-heavy tasks on your website are part of your website’s core code, you will need to work with your development team to optimize them. For third parties, you can check if the script is still needed or contact the provider’s customer support to see if it is possible to optimize the code.
Monitor interaction with next painting
Want to track your progress on INP and other Core Web Vitals? DebugBear can track your website speed and help you optimize it.
Start a 14-day free trial today and deliver a better user experience.
Conclusion
The Next Paint Interaction metric represents the most significant change to Google’s Core Web Vitals since their initial announcement. INP addresses the shortcomings of the previous First Input Delay metric and provides a better representation of how users experience a website.
Check your website’s performance on the Interaction to Next Paint metric before the ranking change rolls out in 2024. This way, you will have enough time to identify optimizations and make your website faster.
Try DebugBear with a 14-day free trial.
