INP is the hardest Core Web Vital for mobile users. While 97% of desktop pages pass, only 74% of mobile pages achieve good INP. That 23-point gap matters—mobile users make up over 60% of web traffic.

INP replaced FID as a Core Web Vital on March 12, 2024. The bar got higher: 93% of sites passed FID, but FID only measured input delay on the first interaction. INP measures everything—every click, tap, and keypress throughout the entire page session.

What is INP?

Interaction to Next Paint measures responsiveness—how long it takes for the page to visually respond after a user interacts. Google uses this definition from the Lighthouse audit:

"Interaction to Next Paint measures page responsiveness, how long it takes the page to visibly respond to user input."

INP Thresholds:

Score Weight: INP doesn't directly affect Lighthouse Performance scores in lab mode. Instead, Lighthouse uses Total Blocking Time (TBT) as a proxy, which accounts for 30% of the score. In field data (CrUX), INP is measured directly.

What Triggers INP

INP only measures discrete interactions—events that have a clear start and end:

Not measured: Scrolling, hovering, and pinch-to-zoom. These are continuous interactions with different performance characteristics.

The browser tracks all qualifying interactions during the page session. Your INP score is typically the worst interaction (or 98th percentile on pages with many interactions).

Why INP Matters

User Experience

Users expect instant feedback. Research shows that delays over 200ms start to feel sluggish. Past 500ms, users assume something is broken.

The consequences of poor INP:

• Users click multiple times, triggering duplicate actions
• Forms feel unresponsive, causing input errors
• E-commerce checkouts get abandoned
• Users perceive your site as low-quality

Since 90% of user time on a page happens after it loads, INP captures the experience that matters most.

SEO Impact

INP officially replaced FID as a Core Web Vital ranking factor on March 12, 2024. While FID only measured the first interaction, INP influences ranking eligibility by measuring all interactions.

For 2025, the bar is strict: Google treats <200ms as the "Good" threshold for ranking boosts. Sites consistently failing this metric may see reduced visibility in competitive search results.

Industry Benchmarks & Competitive Advantage

Passing Core Web Vitals is harder than it looks. As of mid-2024, only ~47% of websites passed all Core Web Vitals.

Fixing INP isn't just about compliance—it's a competitive advantage. If you're in the 47% that pass, you're likely outranking half your competitors on technical merit alone.

Business Impact

Real-world improvements show direct business correlation:

Understanding INP Sub-Parts

Every interaction breaks down into three phases. Presentation delay accounts for ~42% of total INP on average—often the overlooked bottleneck.

The critical insight: Most developers focus on processing duration because that's their code. But input delay and presentation delay often account for 60%+ of total INP. A perfectly efficient event handler still fails INP if the main thread was blocked or the DOM update triggered expensive layout.

Try It: Response Time Lab

Click the buttons to feel the difference between fast and slow responses:

Common INP Issues

Poor INP stems from a handful of causes. Here are the most impactful:

→ Diagnose your specific issue

How to Measure INP

Lab Testing (Proxy)

INP requires real user interaction—you can't measure it with an automated page load. Lab tools use Total Blocking Time (TBT) as a proxy because TBT correlates twice as well with INP than FID did.

Chrome DevTools:

1. Open DevTools → Performance tab
2. Check "Web Vitals" in settings
3. Click record → interact with the page → stop recording
4. Look for interaction events and their duration

Lighthouse: Check the TBT score as your INP proxy. The thresholds are:

• Mobile: Good ≤200ms, Poor >600ms
• Desktop: Good ≤150ms, Poor >350ms

Field Data (Real Users)

Field data is what Google uses for ranking. It represents actual user experience.

PageSpeed Insights: Enter your URL to see CrUX (Chrome User Experience Report) INP data. This shows real-world performance from Chrome users.

Search Console: The Core Web Vitals report shows which URLs pass or fail INP, grouped by similar pages.

Web Vitals JavaScript Library:

import { onINP } from 'web-vitals'

onINP((metric) => {
  console.log('INP:', metric.value, 'ms')
  console.log('Element:', metric.attribution.interactionTarget)
  console.log('Type:', metric.attribution.interactionType)
})

To catch regressions automatically, set up Lighthouse CI in your deployment pipeline.

Mobile vs Desktop Gap

The INP gap between devices is massive:

This 23-point gap means mobile optimization is essential. Mobile devices have:

• Slower CPUs that struggle with JavaScript
• Touch events that can trigger more complex handlers
• Limited memory causing more garbage collection pauses

Test on real mobile devices, not just throttled desktop browsers.

Framework Guides

Framework-specific INP optimizations:

Test Your Entire Site

Most tools test one page at a time. That's a problem for INP—different pages have different JavaScript, different event handlers, and different interaction patterns.

Your homepage might pass while your checkout fails. Product pages might be fast until someone opens the image gallery.

Unlighthouse scans your entire site and shows TBT (INP proxy) scores for every page. You'll see which templates have issues, which pages are outliers, and whether your fixes work at scale.

The CLI is free and runs locally. Cloud adds scheduled monitoring to catch regressions before users report them.

Related

• Core Web Vitals Overview
• All INP Issues & Fixes
• Fix LCP
• Fix CLS
• INP Definition
• TBT Definition