INP, Interaction to Next Paint: The Web Vital That's Killing Ecommerce Scores
INP replaced FID as a Core Web Vital in March 2024. Two years in, most ecommerce stores are failing it — and the fixes aren't what you'd expect from FID experience.
In March 2024, Google replaced First Input Delay (FID) with Interaction to Next Paint (INP) as a Core Web Vital. Two years later, the impact is finally clear: most ecommerce stores that passed FID are failing INP, and the gap between lab scores and field scores has widened.
If you've been treating Core Web Vitals as a "set it and forget it" thing because you fixed your LCP and CLS years ago, INP is probably costing you ranking signal you don't realize you've lost.
What INP Actually Measures
FID measured the delay between a user's first interaction (click, tap, key press) and when the browser could start processing it. It captured one moment, near the start of a session.
INP measures the latency of every interaction a user has with the page — and reports the worst (well, the 98th percentile if more than 50 interactions). It captures the full time from interaction start to the next paint that visually responds to the interaction.
Three thresholds:
- Good: ≤ 200 ms
- Needs improvement: 200 - 500 ms
- Poor: > 500 ms
The shift from FID to INP turned a single, easy-to-pass metric into a stress test for every interactive element on your site.
Why Ecommerce Fails INP More Than Other Verticals
Three reasons:
1. Heavy third-party JavaScript
The average ecommerce site loads 7-12 marketing scripts: analytics, pixels, chat, reviews, recommendations, A/B testing, personalization. Each of these can hijack the main thread. When a user clicks "Add to Cart" and the click handler can't run for 400ms because Klaviyo's tracker is processing a queued event, your INP is in the "poor" bucket.
2. Add-to-Cart and Mini-Cart Open
These are the highest-frequency interactions on a product page. Most platforms (Shopify, WooCommerce, BigCommerce) implement them with synchronous DOM updates that paint the mini-cart visible after a network round-trip to validate inventory, calculate cart totals, and render the mini-cart UI. If any of those steps blocks the main thread, INP suffers.
3. Faceted navigation and filter toggles
Collection pages with filters (size, color, price range, brand) trigger re-renders on every toggle. If your filter logic re-renders the entire product grid synchronously, you're looking at 300-800ms INP per filter click on a 60-product collection.
The 2026 INP Field Data Reality
From Chrome User Experience Report (CrUX) 2026 Q1:
- Sites passing INP at the 75th percentile (Google's threshold for "Good" assessment): 64% of all sites, but only 41% of ecommerce sites
- Average INP for Shopify stores: 285ms (Needs Improvement bucket)
- Average INP for WooCommerce stores: 340ms
- Average INP for BigCommerce stores: 245ms
- Average INP for headless storefronts: 195ms (the one bright spot)
The Lab vs. Field Gap
This is what catches stores off-guard. PageSpeed Insights' lab tests run on a relatively fast simulated mobile device and measure synthetic interactions. Real users on mid-range Android phones with 5+ tabs open and 12 tracking scripts loaded see dramatically worse INP than your lab score suggests.
The gap can be 200ms+. A page that scores 150ms INP in the lab can show 380ms INP in field data. Always check the field data section in PageSpeed Insights (and Search Console's Core Web Vitals report) — that's what Google actually uses for ranking.
The INP Fix Patterns That Actually Work
1. Defer non-critical third-party scripts
Reviews widgets, chat widgets, A/B testing tools, personalization engines — none of these need to run before the user can interact. Defer them with async, lazy-load on scroll, or load on first interaction. The fastest stores load these only after the user has been idle for 2-3 seconds.
2. Break up long tasks with yielding
If your add-to-cart handler does several things synchronously (validate inventory, update cart count, animate the mini-cart, fire analytics events, update recommendations), break it up. Use await scheduler.yield() (where supported) or setTimeout(fn, 0) to yield to the browser between subtasks. The visual response (mini-cart opens) happens fast; the secondary work happens in background.
3. Use CSS-driven UI changes where possible
Mini-cart open/close, filter dropdown expand/collapse, mobile menu toggle — all of these can be CSS-only with :checked hacks or <details> elements. Zero JS, zero INP cost.
4. Optimistic UI for cart actions
Don't wait for the server response before updating the cart count. Update the count optimistically (it almost always succeeds), reconcile asynchronously if the server rejects. Cuts perceived INP by 100-300ms.
5. Throttle filter re-renders
Use requestIdleCallback or a 100ms debounce on filter toggles so users can rapidly toggle multiple filters without each one triggering a full re-render. Apply all changes once the user pauses.
6. Remove the dead-weight scripts
Run a tracking pixel audit and a tech stack audit. The average store has 3-5 scripts that were added for a campaign two years ago, never measured, and never removed. Each one adds main-thread time on every interaction. Remove the zombies.
How to Measure INP for Your Store
Three approaches, in order of accuracy:
- Chrome User Experience Report (CrUX) — real user data over the past 28 days. Authoritative for ranking. Available in Search Console → Core Web Vitals, PageSpeed Insights field data section, and the public CrUX dataset on BigQuery.
- Real User Monitoring (RUM) with the web-vitals.js library — instruments your own pages to capture INP from your real users in real-time. Recommended for any store doing $1M+ in ecommerce revenue. Vercel Analytics, SpeedCurve, and DebugBear all offer this.
- Lab testing with PageSpeed Insights or Lighthouse — useful for catching regressions in development, but the synthetic INP score will be more optimistic than reality.
StoreVitals' free Web Vitals Checker runs a lab Lighthouse test on any URL and shows LCP, CLS, INP, TBT, and the related metrics with category-specific guidance. Use it for quick checks; pair with CrUX for ranking-relevant data.
The 2026 Bottom Line
FID was a participation trophy — most sites passed without trying. INP is a real test of how well your site behaves under realistic load with realistic user behavior. The ecommerce stores winning organic search in 2026 are the ones treating INP as a P0 quarterly project, not a one-time fix.
Audit this week. Aim for 75% of users in the "Good" bucket within one quarter. Most of the work is removing or deferring scripts you don't need anymore — and that work pays back in conversion rate, not just rankings.