Click Below to Get the Code

Browse, clone, and build from real-world templates powered by Harper.
Blog
GitHub Logo

INP Is the New SEO North Star: How to Optimize for Google’s Most Important Metric

Google's March 2024 rollout of Interaction to Next Paint (INP) as a Core Web Vitals metric marks a new chapter in SEO, emphasizing real-world interactivity over traditional speed signals. INP captures the full lifecycle of a user’s interaction, making responsiveness a key driver of search rankings, user experience, and conversion rates. SEO teams that optimize for INP—especially on mobile—gain a measurable advantage in performance, engagement, and business impact.
Blog

INP Is the New SEO North Star: How to Optimize for Google’s Most Important Metric

Martin Spiek
SEO Subject Matter Expert
at Harper
July 24, 2025
Martin Spiek
SEO Subject Matter Expert
at Harper
July 24, 2025
Martin Spiek
SEO Subject Matter Expert
at Harper
July 24, 2025
July 24, 2025
Google's March 2024 rollout of Interaction to Next Paint (INP) as a Core Web Vitals metric marks a new chapter in SEO, emphasizing real-world interactivity over traditional speed signals. INP captures the full lifecycle of a user’s interaction, making responsiveness a key driver of search rankings, user experience, and conversion rates. SEO teams that optimize for INP—especially on mobile—gain a measurable advantage in performance, engagement, and business impact.
Martin Spiek
SEO Subject Matter Expert

For years, search engine optimization has revolved around keywords, backlinks, and site structure. With the introduction of Interaction to Next Paint (INP) as the official Core Web Vitals metric for responsiveness in March 2024, Google redefined the priorities for performance-based SEO. INP centers the conversation around how responsive a website feels during real-world user interactions—on actual devices, under real-world conditions.

This update reflects a new era in SEO, one that values interactivity and seamless engagement just as much as traditional technical fundamentals. For SEO professionals who want to stay competitive, understanding and optimizing for INP is a direct path to higher rankings, better UX, and more conversions.

Why Google Made INP the New Standard

INP captures the full lifecycle of a user’s interaction, starting from the moment they click or tap to the moment the screen visibly responds. It accounts for input delay, processing time, and the subsequent visual update. By measuring the slowest interaction in a page session, INP provides a comprehensive view of responsiveness.

Earlier metrics like First Input Delay (FID) provided a starting point for measuring input responsiveness, but INP delivers a broader, more representative metric that reflects the reality of multi-step user engagement. Based on data from the Chrome UX Report, INP provides a stronger correlation with user frustration and bounce behavior.

To meet Google’s benchmark for performance, pages should aim for an INP of less than 200 milliseconds. Scores between 200 and 500 ms fall into the “needs improvement” category, while anything over 500 ms is considered poor. According to recent data from SpeedCurve, 96.8% of desktop sites meet Google’s “good” INP threshold (≤ 200 ms), while only 64.9% of mobile sites do—highlighting the ongoing challenge of mobile responsiveness in real-world conditions.

What Drives INP and Why It Matters

A strong INP score comes from a site that is built to handle interactions gracefully, even under strain. That includes using lightweight JavaScript, minimizing layout shifts, serving assets efficiently, and responding quickly to taps and clicks. Pages with optimized event handlers, thoughtful rendering strategies, and responsive design patterns naturally achieve lower INP scores.

Many modern sites rely on heavy frameworks, large DOMs, and multiple third-party scripts, which can cause performance slowdowns. Layout recalculations, delayed API responses, or oversized assets often contribute to lag in responsiveness. A holistic view of the stack—front end and back end together—reveals how these components work in unison to shape the user experience.

INP emphasizes how performance is felt rather than how it is measured synthetically. Real-user monitoring (RUM) tools such as New Relic, Datadog, or SpeedCurve provide accurate INP insights across devices and geographies. For custom implementations, the web-vitals.js library lets teams collect INP metrics directly within analytics platforms.

Why INP Drives Results Across SEO and Business Metrics

When redBus improved its INP by 72%, it saw a 7 % lift in sales, according to its official web.dev case study; similarly, The Economic Times cut its INP nearly fourfold—helping drive a 50 % decrease in bounce rate and a 43 % increase in pageviews, as detailed in its web.dev INP report.

Responsiveness plays a central role in SEO today. Visitors who experience fast, smooth interactions are more likely to continue navigating, engage longer, and convert more often. Google recognizes this behavior, which is why INP increasingly influences search rankings. A high-performing INP score demonstrates not only technical excellence but also deep alignment with user expectations.

How to Optimize INP Effectively

The best path to improving INP starts with understanding where responsiveness lags. Field data often points to specific trouble spots—such as a laggy search field, a delayed navigation drawer, or a complex form. Addressing these touchpoints with performance-first practices drives significant improvements.

Refactoring long JavaScript tasks into smaller, asynchronous chunks helps keep the main thread available for high-priority interactions. Frameworks like Vue and React Library offer features like lazy loading, code splitting, and suspense, which can be used to prioritize interactivity. Using browser APIs like requestIdleCallback or requestAnimationFrame ensures that updates are timed appropriately.

Image optimization also contributes to INP performance. Switching from legacy formats to AVIF or WebP reduces payload size and visual rendering time. Combining this with responsive loading ensures that users get the right asset for their device and screen.

For teams using commercial platforms like Salesforce Commerce, Shopify, Magento, or BigCommerce, platform optimization is equally important. Removing unused apps, limiting external libraries, and refining the presentation layer all contribute to leaner, faster interactions. Focusing development resources on actual customer journeys—rather than the platform’s default code—ensures that the site is tailored to deliver peak performance.

Content delivery also plays a vital role. A well-configured CDN ensures that site assets are available close to the user, reducing latency and improving INP. Distributed architectures that replicate data and rendering workloads across global edge locations can enhance responsiveness by minimizing distance and delay.

What INP Signals About the Future of SEO

INP reflects a deeper shift in how SEO is evaluated. With growing emphasis on user experience, and as AI-assisted discovery tools like ChatGPT and Perplexity rise in prominence, responsiveness becomes an essential signal for both humans and machines. Sites that prioritize INP are not only better suited for search engines but also more likely to be recommended by AI systems curating high-quality content.

Many top-ranking sites still display INP scores in the “needs improvement” or “poor” range, especially on mobile devices. This presents a competitive advantage for agile teams willing to embrace performance as a core part of their SEO strategy. By making INP a key performance indicator, businesses can stay ahead of evolving ranking factors and deliver better outcomes for their users.

SEO now rewards sites that feel fast—not just those that load fast. Prioritizing INP gives digital teams a measurable, user-focused target that aligns with business impact and future-proofs their visibility.

Making every interaction count is the foundation of modern search performance. INP shows you exactly where to begin.

For years, search engine optimization has revolved around keywords, backlinks, and site structure. With the introduction of Interaction to Next Paint (INP) as the official Core Web Vitals metric for responsiveness in March 2024, Google redefined the priorities for performance-based SEO. INP centers the conversation around how responsive a website feels during real-world user interactions—on actual devices, under real-world conditions.

This update reflects a new era in SEO, one that values interactivity and seamless engagement just as much as traditional technical fundamentals. For SEO professionals who want to stay competitive, understanding and optimizing for INP is a direct path to higher rankings, better UX, and more conversions.

Why Google Made INP the New Standard

INP captures the full lifecycle of a user’s interaction, starting from the moment they click or tap to the moment the screen visibly responds. It accounts for input delay, processing time, and the subsequent visual update. By measuring the slowest interaction in a page session, INP provides a comprehensive view of responsiveness.

Earlier metrics like First Input Delay (FID) provided a starting point for measuring input responsiveness, but INP delivers a broader, more representative metric that reflects the reality of multi-step user engagement. Based on data from the Chrome UX Report, INP provides a stronger correlation with user frustration and bounce behavior.

To meet Google’s benchmark for performance, pages should aim for an INP of less than 200 milliseconds. Scores between 200 and 500 ms fall into the “needs improvement” category, while anything over 500 ms is considered poor. According to recent data from SpeedCurve, 96.8% of desktop sites meet Google’s “good” INP threshold (≤ 200 ms), while only 64.9% of mobile sites do—highlighting the ongoing challenge of mobile responsiveness in real-world conditions.

What Drives INP and Why It Matters

A strong INP score comes from a site that is built to handle interactions gracefully, even under strain. That includes using lightweight JavaScript, minimizing layout shifts, serving assets efficiently, and responding quickly to taps and clicks. Pages with optimized event handlers, thoughtful rendering strategies, and responsive design patterns naturally achieve lower INP scores.

Many modern sites rely on heavy frameworks, large DOMs, and multiple third-party scripts, which can cause performance slowdowns. Layout recalculations, delayed API responses, or oversized assets often contribute to lag in responsiveness. A holistic view of the stack—front end and back end together—reveals how these components work in unison to shape the user experience.

INP emphasizes how performance is felt rather than how it is measured synthetically. Real-user monitoring (RUM) tools such as New Relic, Datadog, or SpeedCurve provide accurate INP insights across devices and geographies. For custom implementations, the web-vitals.js library lets teams collect INP metrics directly within analytics platforms.

Why INP Drives Results Across SEO and Business Metrics

When redBus improved its INP by 72%, it saw a 7 % lift in sales, according to its official web.dev case study; similarly, The Economic Times cut its INP nearly fourfold—helping drive a 50 % decrease in bounce rate and a 43 % increase in pageviews, as detailed in its web.dev INP report.

Responsiveness plays a central role in SEO today. Visitors who experience fast, smooth interactions are more likely to continue navigating, engage longer, and convert more often. Google recognizes this behavior, which is why INP increasingly influences search rankings. A high-performing INP score demonstrates not only technical excellence but also deep alignment with user expectations.

How to Optimize INP Effectively

The best path to improving INP starts with understanding where responsiveness lags. Field data often points to specific trouble spots—such as a laggy search field, a delayed navigation drawer, or a complex form. Addressing these touchpoints with performance-first practices drives significant improvements.

Refactoring long JavaScript tasks into smaller, asynchronous chunks helps keep the main thread available for high-priority interactions. Frameworks like Vue and React Library offer features like lazy loading, code splitting, and suspense, which can be used to prioritize interactivity. Using browser APIs like requestIdleCallback or requestAnimationFrame ensures that updates are timed appropriately.

Image optimization also contributes to INP performance. Switching from legacy formats to AVIF or WebP reduces payload size and visual rendering time. Combining this with responsive loading ensures that users get the right asset for their device and screen.

For teams using commercial platforms like Salesforce Commerce, Shopify, Magento, or BigCommerce, platform optimization is equally important. Removing unused apps, limiting external libraries, and refining the presentation layer all contribute to leaner, faster interactions. Focusing development resources on actual customer journeys—rather than the platform’s default code—ensures that the site is tailored to deliver peak performance.

Content delivery also plays a vital role. A well-configured CDN ensures that site assets are available close to the user, reducing latency and improving INP. Distributed architectures that replicate data and rendering workloads across global edge locations can enhance responsiveness by minimizing distance and delay.

What INP Signals About the Future of SEO

INP reflects a deeper shift in how SEO is evaluated. With growing emphasis on user experience, and as AI-assisted discovery tools like ChatGPT and Perplexity rise in prominence, responsiveness becomes an essential signal for both humans and machines. Sites that prioritize INP are not only better suited for search engines but also more likely to be recommended by AI systems curating high-quality content.

Many top-ranking sites still display INP scores in the “needs improvement” or “poor” range, especially on mobile devices. This presents a competitive advantage for agile teams willing to embrace performance as a core part of their SEO strategy. By making INP a key performance indicator, businesses can stay ahead of evolving ranking factors and deliver better outcomes for their users.

SEO now rewards sites that feel fast—not just those that load fast. Prioritizing INP gives digital teams a measurable, user-focused target that aligns with business impact and future-proofs their visibility.

Making every interaction count is the foundation of modern search performance. INP shows you exactly where to begin.

Google's March 2024 rollout of Interaction to Next Paint (INP) as a Core Web Vitals metric marks a new chapter in SEO, emphasizing real-world interactivity over traditional speed signals. INP captures the full lifecycle of a user’s interaction, making responsiveness a key driver of search rankings, user experience, and conversion rates. SEO teams that optimize for INP—especially on mobile—gain a measurable advantage in performance, engagement, and business impact.

Download

White arrow pointing right
Google's March 2024 rollout of Interaction to Next Paint (INP) as a Core Web Vitals metric marks a new chapter in SEO, emphasizing real-world interactivity over traditional speed signals. INP captures the full lifecycle of a user’s interaction, making responsiveness a key driver of search rankings, user experience, and conversion rates. SEO teams that optimize for INP—especially on mobile—gain a measurable advantage in performance, engagement, and business impact.

Download

White arrow pointing right
Google's March 2024 rollout of Interaction to Next Paint (INP) as a Core Web Vitals metric marks a new chapter in SEO, emphasizing real-world interactivity over traditional speed signals. INP captures the full lifecycle of a user’s interaction, making responsiveness a key driver of search rankings, user experience, and conversion rates. SEO teams that optimize for INP—especially on mobile—gain a measurable advantage in performance, engagement, and business impact.

Download

White arrow pointing right

Explore Recent Resources

Livestream
GitHub Logo

2 Hour Build - Live Stream for Non-Developers

A non-developer's live stream walkthrough of building Flow State, a Colorado river-flow app for rafters, in two hours using ChatGPT dictation, Claude Code, Claude Design, and Harper. Scaffold with npm create harper@latest and deploy to Harper Fabric. No coding background required.
Livestream
A non-developer's live stream walkthrough of building Flow State, a Colorado river-flow app for rafters, in two hours using ChatGPT dictation, Claude Code, Claude Design, and Harper. Scaffold with npm create harper@latest and deploy to Harper Fabric. No coding background required.
Person with short dark hair and moustache, wearing a colorful plaid shirt, smiling outdoors in a forested mountain landscape.
Aleks Haugom
Senior Manager of GTM
Livestream

2 Hour Build - Live Stream for Non-Developers

A non-developer's live stream walkthrough of building Flow State, a Colorado river-flow app for rafters, in two hours using ChatGPT dictation, Claude Code, Claude Design, and Harper. Scaffold with npm create harper@latest and deploy to Harper Fabric. No coding background required.
Aleks Haugom
May 2026
Livestream

2 Hour Build - Live Stream for Non-Developers

A non-developer's live stream walkthrough of building Flow State, a Colorado river-flow app for rafters, in two hours using ChatGPT dictation, Claude Code, Claude Design, and Harper. Scaffold with npm create harper@latest and deploy to Harper Fabric. No coding background required.
Aleks Haugom
Livestream

2 Hour Build - Live Stream for Non-Developers

A non-developer's live stream walkthrough of building Flow State, a Colorado river-flow app for rafters, in two hours using ChatGPT dictation, Claude Code, Claude Design, and Harper. Scaffold with npm create harper@latest and deploy to Harper Fabric. No coding background required.
Aleks Haugom
Tutorial
GitHub Logo

Production Quality at Vibe Code Velocity: Dispatched Agent Teams with Harper

Harper enables production-grade agentic engineering by collapsing database, cache, runtime, and messaging into one process, reducing agent complexity and review burden. A multi-model dispatch workflow lets specialized agents plan, code, QA, and review in parallel while humans retain control over critical decisions.
Tutorial
Harper enables production-grade agentic engineering by collapsing database, cache, runtime, and messaging into one process, reducing agent complexity and review burden. A multi-model dispatch workflow lets specialized agents plan, code, QA, and review in parallel while humans retain control over critical decisions.
Person with very short hair and a goatee wearing a plaid button‑up shirt over a white undershirt, smiling outdoors with leafy greenery behind.
Jeff Darnton
SVP, Professional Services & Customer Success
Tutorial

Production Quality at Vibe Code Velocity: Dispatched Agent Teams with Harper

Harper enables production-grade agentic engineering by collapsing database, cache, runtime, and messaging into one process, reducing agent complexity and review burden. A multi-model dispatch workflow lets specialized agents plan, code, QA, and review in parallel while humans retain control over critical decisions.
Jeff Darnton
May 2026
Tutorial

Production Quality at Vibe Code Velocity: Dispatched Agent Teams with Harper

Harper enables production-grade agentic engineering by collapsing database, cache, runtime, and messaging into one process, reducing agent complexity and review burden. A multi-model dispatch workflow lets specialized agents plan, code, QA, and review in parallel while humans retain control over critical decisions.
Jeff Darnton
Tutorial

Production Quality at Vibe Code Velocity: Dispatched Agent Teams with Harper

Harper enables production-grade agentic engineering by collapsing database, cache, runtime, and messaging into one process, reducing agent complexity and review burden. A multi-model dispatch workflow lets specialized agents plan, code, QA, and review in parallel while humans retain control over critical decisions.
Jeff Darnton
Tutorial
GitHub Logo

Change Data Capture Into a Runtime: One Pipeline for Pages, Search, and AI Agents

Learn how Harper turns CDC streams into real-time workflows that refresh cached pages, update search indexes, and keep AI agent context current. See why landing changes in an application runtime beats warehouses, queues, and traditional CDNs.
Tutorial
Learn how Harper turns CDC streams into real-time workflows that refresh cached pages, update search indexes, and keep AI agent context current. See why landing changes in an application runtime beats warehouses, queues, and traditional CDNs.
Person with very short hair and a goatee wearing a plaid button‑up shirt over a white undershirt, smiling outdoors with leafy greenery behind.
Jeff Darnton
SVP, Professional Services & Customer Success
Tutorial

Change Data Capture Into a Runtime: One Pipeline for Pages, Search, and AI Agents

Learn how Harper turns CDC streams into real-time workflows that refresh cached pages, update search indexes, and keep AI agent context current. See why landing changes in an application runtime beats warehouses, queues, and traditional CDNs.
Jeff Darnton
May 2026
Tutorial

Change Data Capture Into a Runtime: One Pipeline for Pages, Search, and AI Agents

Learn how Harper turns CDC streams into real-time workflows that refresh cached pages, update search indexes, and keep AI agent context current. See why landing changes in an application runtime beats warehouses, queues, and traditional CDNs.
Jeff Darnton
Tutorial

Change Data Capture Into a Runtime: One Pipeline for Pages, Search, and AI Agents

Learn how Harper turns CDC streams into real-time workflows that refresh cached pages, update search indexes, and keep AI agent context current. See why landing changes in an application runtime beats warehouses, queues, and traditional CDNs.
Jeff Darnton
Tutorial
GitHub Logo

Harper + Vertex AI: The Architecture Every Agent Builder Should Know

Production agents bleed tokens and latency on repeated queries. Pair a managed model layer with a vector-indexed data layer at the edge, and an 80% cache hit rate cuts LLM spend by 80% while delivering sub-100ms responses on semantically similar requests.
Tutorial
Production agents bleed tokens and latency on repeated queries. Pair a managed model layer with a vector-indexed data layer at the edge, and an 80% cache hit rate cuts LLM spend by 80% while delivering sub-100ms responses on semantically similar requests.
Person with styled reddish‑brown hair and a full beard wearing a gray suit with a light blue shirt and dark green tie, posing outdoors with a blurred pathway and greenery behind.
Drew Chambers
CMO
Tutorial

Harper + Vertex AI: The Architecture Every Agent Builder Should Know

Production agents bleed tokens and latency on repeated queries. Pair a managed model layer with a vector-indexed data layer at the edge, and an 80% cache hit rate cuts LLM spend by 80% while delivering sub-100ms responses on semantically similar requests.
Drew Chambers
May 2026
Tutorial

Harper + Vertex AI: The Architecture Every Agent Builder Should Know

Production agents bleed tokens and latency on repeated queries. Pair a managed model layer with a vector-indexed data layer at the edge, and an 80% cache hit rate cuts LLM spend by 80% while delivering sub-100ms responses on semantically similar requests.
Drew Chambers
Tutorial

Harper + Vertex AI: The Architecture Every Agent Builder Should Know

Production agents bleed tokens and latency on repeated queries. Pair a managed model layer with a vector-indexed data layer at the edge, and an 80% cache hit rate cuts LLM spend by 80% while delivering sub-100ms responses on semantically similar requests.
Drew Chambers
Blog
GitHub Logo

Why Harper is the Definitive Platform for Enterprise Citizen Developers

Harper bridges the gap between business agility and IT security. Utilizing a unified runtime, Harper Fabric guarantees data sovereignty across any environment, from public clouds to air-gapped facilities. Empower users with secure, compliant AI application development and robust governance.
Blog
Harper bridges the gap between business agility and IT security. Utilizing a unified runtime, Harper Fabric guarantees data sovereignty across any environment, from public clouds to air-gapped facilities. Empower users with secure, compliant AI application development and robust governance.
A smiling man with a beard and salt-and-pepper hair stands outdoors with arms crossed, wearing a white button-down shirt.
Stephen Goldberg
CEO & Co-Founder
Blog

Why Harper is the Definitive Platform for Enterprise Citizen Developers

Harper bridges the gap between business agility and IT security. Utilizing a unified runtime, Harper Fabric guarantees data sovereignty across any environment, from public clouds to air-gapped facilities. Empower users with secure, compliant AI application development and robust governance.
Stephen Goldberg
May 2026
Blog

Why Harper is the Definitive Platform for Enterprise Citizen Developers

Harper bridges the gap between business agility and IT security. Utilizing a unified runtime, Harper Fabric guarantees data sovereignty across any environment, from public clouds to air-gapped facilities. Empower users with secure, compliant AI application development and robust governance.
Stephen Goldberg
Blog

Why Harper is the Definitive Platform for Enterprise Citizen Developers

Harper bridges the gap between business agility and IT security. Utilizing a unified runtime, Harper Fabric guarantees data sovereignty across any environment, from public clouds to air-gapped facilities. Empower users with secure, compliant AI application development and robust governance.
Stephen Goldberg
Comparison
GitHub Logo

Harper vs. Vercel + Supabase

Harper offers a unified application platform alternative to Vercel + Supabase, combining database, cache, app logic, messaging, vectors, and real-time capabilities in one globally distributed runtime to reduce latency, operational complexity, and total cost of ownership.
Comparison
Harper offers a unified application platform alternative to Vercel + Supabase, combining database, cache, app logic, messaging, vectors, and real-time capabilities in one globally distributed runtime to reduce latency, operational complexity, and total cost of ownership.
Colorful geometric illustration of a dog's head resembling folded paper art in shades of teal and pink.
Harper
Comparison

Harper vs. Vercel + Supabase

Harper offers a unified application platform alternative to Vercel + Supabase, combining database, cache, app logic, messaging, vectors, and real-time capabilities in one globally distributed runtime to reduce latency, operational complexity, and total cost of ownership.
Harper
May 2026
Comparison

Harper vs. Vercel + Supabase

Harper offers a unified application platform alternative to Vercel + Supabase, combining database, cache, app logic, messaging, vectors, and real-time capabilities in one globally distributed runtime to reduce latency, operational complexity, and total cost of ownership.
Harper
Comparison

Harper vs. Vercel + Supabase

Harper offers a unified application platform alternative to Vercel + Supabase, combining database, cache, app logic, messaging, vectors, and real-time capabilities in one globally distributed runtime to reduce latency, operational complexity, and total cost of ownership.
Harper