If you care about site speed and improving your Core Web Vitals for SEO, it's time to start paying attention to a new metric in town: Interaction to Next Paint, or INP. Interaction to Next Paint measures website responsiveness. Faster response times will feel snappy and smooth, while slower response times will feel laggy, with the latter causing frustration with each consecutive action until a user ends up leaving your site.

As with all web performance metrics, the ultimate goal is not to achieve the lowest number, but instead to create the best possible user experience so that visitors will stay on your site longer and be more inclined to make a purchase.

On the 10th of May 2023, Google announced that INP will replace FID (First Input Delay) in its Core Web Vitals. Both INP and FID are similar in that they measure page responsiveness, but FID has some shortcomings that INP addresses. Where as FID was pretty easy to keep under control, INP will be more challenging to optimize for since its a more comprehensive metric.

How is INP measured?

Since INP's goal is to measure how responsive a page is, it does this by looking at interactions with a page and looking at how long they take. You can think of an interaction as when a visitor taps on a link, adds something to their cart, opens a menu, etc.

If there are less than 50 interactions in total on a page, INP will be how long the single longest interaction took (interaction latency). If there are more than 50 interactions, INP will be the 98th percentile of interaction latency.

Interaction latency measures the time from when a user interacts with a page (such as a tap, click, or press of a key) until the next frame is presented (meaning the user sees something different on their screen and gets the feedback that their interaction has triggered the change). This duration of time includes:

• input delay - which is the time between a user interacting with the page and event handlers executing
• processing time - which is the time it takes associated event handler code to execute
• presentation delay - which is the time between processing finishing and the browser rendering the next frame

INP considers all page interactions and the full interaction latency, where as FID measures the first interaction and only the input delay of that interaction - hence why FID measurements are faster and have lower thresholds. Since INP gives a much more accurate representation of a page's responsiveness, we wouldn't be surprised if INP replaced FID in the near future, when it's no longer an experimental metric (opinion).

What should my site's INP be?

Like other performance metrics, Google has set standards for thresholds of "Good", "Needs Improvement", and "Poor" for INP:

• Good is below 200 milliseconds
• Needs Improvement is between 200 and 500 milliseconds
• Poor is above 500 milliseconds

If your site was within the Good threshold for all Core Web Vitals (LCP, FID, CLS) prior to the release of INP, it does not guarantee that your site is within the Good threshold for INP (see the example featured image from this article). We recommend running your site through PageSpeed Insights and looking at the metrics to see where your site falls.

How do I improve INP?

To improve INP, we recommend looking at the typical ways of optimizing interaction delays, such as reducing the number of 3rd parties, deferring code that doesn't need to load early on, prioritizing elements and features that your users will most likely want to interact with immediately, etc.

Additionally, Google provided an example of the difference between poor responsiveness and good responsiveness, so it might be worth recording interactions across your site and determining where you can add elements to provide better feedback to your visitor that the action they've taken is processing.

Next Steps

Web performance optimization is a balancing act and requires consistent experimentation to do well. INP is just one out of other performance metrics you'll need to pay attention to keep your site fast and to improve your search rankings in Google.

Render Better has been optimizing Shopify sites of all sizes for years, so we have a lot of experience with performance issues that INP tracks and how to solve them so you don't have to figure this out on your own. If you'd like to try our platform or get some help analyzing your performance, check out our offer below to book a call with one of our experts.