Google announced that the new Interaction to Next Paint (INP) metric will become one of the three Core Web Vitals metrics on March 12, 2024. This replaces the old First Input Delay metric.
This is the biggest change to web vitals since Google first introduced them as a ranking factor in 2021.
What is the next interaction with Paint?
Each of the three Core Web Vitals metrics measure different aspects of the user experience on your website. INP evaluates how quickly a website responds to user interactions.
For example, if a visitor clicks a button on your website and it takes a second for the updated page content to appear, that means the user experience is poor.
Interaction to next paint time measures the time that elapses between a user interaction and the next time the browser is able to update the content on the screen. The more CPU processing required to process interactions and display new content, the worse your INP score will be.
Does Interaction to Next affect Google rankings?
Google acknowledges Core Web Vitals as a ranking factor. This means that if your site has a low INP score, it may rank lower than competitors that perform well on all three Web Vitals metrics.
INP should be less than 200 ms to get a good score. Delays greater than 500ms are considered bad. As your INP deteriorates between good and bad thresholds, your SEO will be affected over time.
How does Google know how quickly your website responds to user interactions? This data is collected from real Chrome users as part of the Chrome User Experience Report (CrUX).
How to test interactions with Next Paint on your website
Want to know how well your website performs on INP metrics and other key Web Vitals? One easy way to check is by running the free Core Web Vitals test on your website . Just enter the URL of your page and wait for the test results.
The actual user interaction with Next Paint data can be found here: web vital tab. 25-week trends tell you whether your pages are getting better or worse over time.
The data shown here is from the Google CrUX report.
For a broader view of different page groups on your website, use Google Search Console's[Core Web Vitals]You can also check the tabs. Here you can see the number of pages affected by INP issues or failing the Core Web Vitals assessment.
Unfortunately, the data provided by Google is not very nuanced, and due to the page grouping mechanism, it may not be possible to determine which specific pages are affected by slow Next Paint interactions.
Google CrUX data is also aggregated over 28 days. This means you have to wait a few weeks to see the impact of optimization.
For more detailed insights, dedicated real-user Core Web Vitals monitoring tools like DebugBear can help. This way, you get detailed Core Web Vitals data across your entire website, updated as soon as changes are deployed.
How can I speed up interactions and improve INP?
To improve your website's INP score, you need to know what CPU processing is involved in user interactions. INP can be divided into three components.
- Input delay: A background task that prevents the browser from processing an interaction until the task completes.
- Processing time: Execution of code that processes user interactions and schedules user interface updates
- Presentation delay: After a UI update is scheduled, the browser must refresh the page layout to display the new content.
The Performance tab in Chrome DevTools shows you how long interactions on your page are taking and what's causing CPU processing.
The data in the DevTools Performance tab can be difficult to read and usually requires developer involvement. However, it provides an accounting for every millisecond the browser spends processing an event.
For example, you might find that:
- Third-party code is running in the background and slows down interactions.
- The JavaScript code that your website executes in response to interactions must be optimized.
- You can schedule CPU tasks more efficiently to reduce the amount of time interactions are blocked.
By monitoring real users with DebugBear, you can see which INP components contribute the most to your website's unresponsiveness.
Additionally, interactions often take a long time during the website's initial loading process. This is because when the page first starts to load, many small tasks run in the background to set up the page, such as loading ads and initializing forms and chat widgets.
DebugBear shows you the speed of interactions at different stages and a breakdown of how often interactions occur within these time periods (indicated by the height of the bars).
If your website supports the Long Animation Frames API, you can also see specific scripts or JavaScript functions that are causing delays in visitor interactions.
How do I know which page interactions are affected by slow INP?
If you want to optimize your code and test interactions on your website, you need to know which elements on your website users interact with most often and which interactions often cause INP delays.
This is not data you can get from Google CrUX reports, but specialized Core Web Vitals monitoring tools such as DebugBear collect this information.
You can filter your data by page, device type, and many other factors to better understand how your visitors experience your website. DebugBear reports provide targeted advice on how to improve your next interaction with Paint.
How to monitor interactions with Next Paint and other key web vitals
Real User Monitoring (RUM) solutions can help you prepare for new Interaction to Next Paint metrics and stay on top of your core web vitals over time.
Try DebugBear with a 14-day free trial. Continuously measure the vitals of your web and see which pages would benefit most from optimization.
Simply install the DebugBear analytics snippet to gain insight into your visitor experience. Avoid the 28-day delay associated with Google's Web Vitals data and get detailed reports that you can use to provide a better website experience and rank higher on Google.