Back

Core Web Vitals in 2026: 10 Steps to a Faster Website

  • Digital Tokri
  • February 16, 2026

Core Web Vitals have seen major changes over the last several years. Google has introduced more than 50 bug fixes, new features, and metric definition improvements to evaluate website performance better. But only 62.1% of origins passed Largest Contentful Paint (LCP) as of May 2024.

The official replacement of FID with INP in March 2024 caused nearly 600,000 websites to fail Core Web Vitals. This dramatic change emphasises the crucial relationship between core web vitals and SEO success. Deloitte’s research shows that “61% of customers would stop buying from a company because a competitor provided a better experience”. This statistic shows why website performance matters not just for search rankings but also for business success.

This piece walks through 10 practical steps to optimise your website for Core Web Vitals in 2026 and beyond. Your website will become faster and more competitive with these strategies, whether you struggle with poor LCP scores or need to understand the new INP metric.

Step 1: Understand the 2026 Core Web Vitals Landscape

Website performance optimisation in 2026 depends on understanding today’s Core Web Vitals. These metrics are the foundations of measuring user experience, and they directly affect your site’s search visibility.

What changed since 2020

Google introduced Core Web Vitals at the time of its page experience update in early 2020. The metrics were meant to assess real-life user experience by looking at loading performance, interactivity, and visual stability. Now they’ve become crucial ranking factors you can’t ignore to succeed in SEO.

Google has made its measurement methods better over the years and now pays more attention to mobile performance. The benchmarks that define “good” scores haven’t changed, but the focus has moved toward real-life field data instead of lab testing environments.

The current Core Web Vitals trio consists of:

  • Largest Contentful Paint (LCP): Measures loading performance (want to hit 2.5 seconds or less)
  • Interaction to Next Paint (INP): Measures responsiveness (want to hit 200 milliseconds or less)
  • Cumulative Layout Shift (CLS): Measures visual stability (want to hit 0.1 or less)

Why INP replaced FID

The most important change happened when Interaction to Next Paint (INP) took over from First Input Delay (FID) as the responsiveness metric. This switch became official in March 2024 after years of testing and community feedback.

FID’s limited scope prompted this change. It only measured the delay until the browser’s response to the first interaction. INP goes further by measuring the complete time until you see the visual response. FID looked at just one interaction, but INP watches all interactions during your entire page visit.

From a technical standpoint, INP gives a full picture by measuring:

  • Input delay: Time between user interaction and event handler execution
  • Processing delay: Time needed to execute associated event handlers
  • Presentation delay: Time between event handler completion and the browser presenting the next frame

INP shows better how responsive your site feels to real users. Chrome officially stopped supporting FID on September 9, 2024, which means all tools now use INP measurements.

How these changes affect your site

Your website in 2026 needs performance optimisation beyond just the initial page load. You can’t just optimise the first interaction anymore – the entire user experience matters now.

Numbers tell an interesting story: desktop devices score “Good” INP 88% of the time, while mobile devices reach this mark only 67% of the time. Mobile experiences clearly need more attention, especially since Google keeps emphasising mobile performance.

WordPress developers have adapted to meet these challenges. Themes now build Core Web Vitals into their foundation. Plugin creators focus on performance as much as features. Hosting companies offer specialised infrastructure to help you get excellent scores.

Core Web Vitals are just one of hundreds of Google ranking factors. They won’t magically push you to the top, but poor scores will hold back your ranking potential. Better website performance metrics naturally bring improved visibility, traffic, and conversions.

User experience sits at the heart of SEO in 2026. Optimising these metrics helps your website support Google’s mission to give searchers the best possible experience.

Step 2: Optimise Largest Contentful Paint (LCP)

A strong Core Web Vitals score depends on optimising Largest Contentful Paint (LCP). Your site’s performance in 2026 and beyond will substantially improve as Google continues to emphasise user experience.

Avoid lazy loading LCP elements

Lazy loading helps improve page speed by loading images only when they are needed. However, when applied incorrectly to key visual elements at the top of a page, it can slow down how quickly users see important content. This delay can negatively affect user experience and performance metrics.

For better results, important above-the-fold visuals should load immediately, while lazy loading is reserved for content further down the page. Since key elements may differ across devices, a safer approach is to ensure all critical, visible content loads without delay.

Another effective practice is prioritising essential resources early in the page load process. This ensures that important visuals and assets appear quickly, even if they are referenced indirectly or embedded within styles or external files.

Overall, improving page performance involves making key content easy for browsers to detect, prioritising critical assets, and avoiding delays on visible elements. When done correctly, these optimisations significantly enhance loading speed, user experience, and overall Core Web Vitals performance.

Step 3: Improve Cumulative Layout Shift (CLS)

Cumulative Layout Shift (CLS) stands out as the most visually noticeable Core Web Vitals metric users experience. Deloitte reports that “61% of customers would stop buying from a company because a competitor provided a better experience”. Your site’s visitors might leave immediately due to unexpected layout shifts, especially when you have a frustrating user experience.

Unexpected layout shifts usually happen when images, ads, or dynamic elements load without reserved space. When this occurs, content moves around as the page loads, leading to a poor visual experience. To avoid this, it’s important to ensure that space is allocated for images, media, and ads in advance so the layout remains stable, even if some elements load slowly or fail to appear.

Another common cause of layout issues is delaying styles needed for visible content. When essential styling isn’t available immediately, users may see flashes of unstyled or shifting content. Ensuring that key styles for the initial screen load are available upfront helps pages render smoothly and consistently.

Fonts can also impact visual stability. When a page switches from a fallback font to a custom font after loading, text can jump or briefly disappear. Using well-matched fallback fonts and reducing visible changes during font loading helps keep text stable.

By reserving space for content, prioritising visible styles, and managing font loading carefully, websites can create a smoother, more stable browsing experience that improves user engagement and Core Web Vitals performance.

Step 4: Enhance Interaction to Next Paint (INP)

Your website’s response time to user interactions is what INP measures. This metric matters a lot for SEO and user experience. Users love websites that respond quickly. Google’s focus on Core Web Vitals means you need to put INP optimisation at the top of your list.

Reduce DOM size

Poor INP scores often stem from having too many DOM elements. Performance guidelines tell us that a DOM becomes too large when it goes beyond 1,400 nodes. You’ll start seeing warnings at 800 nodes. The time needed for style calculations and layout operations goes up with larger DOMs, which slows down page response times.

Your DOM size and rendering work don’t increase at the same rate. Yet bigger DOMs always need more processing power than smaller ones. This creates problems in two cases:

  1. Your page’s first render takes longer because of the large DOM
  2. Simple user actions can trigger expensive rendering updates

Here’s how to make your DOM better:

  • Get rid of unnecessary nested elements (stay away from div-soup patterns)
  • Load HTML for hidden content only when needed
  • Use fragments in component-based frameworks to avoid extra parent containers
  • Cut down on inline styles and scripts to keep the initial HTML small

Rendering large sections of content only when they are needed can significantly improve website responsiveness. By delaying the processing of offscreen content, pages load faster, scrolling feels smoother, and more system resources remain available for user interactions. Reserving space for this delayed content also helps prevent layout shifts when it appears on screen.

Another major factor affecting responsiveness is the use of third-party scripts. Tools like analytics, chat widgets, ads, and social media embeds often run heavy tasks during user interactions, which can slow down response times. Reducing unnecessary scripts and controlling when they load helps keep the website responsive.

Since interaction performance is measured by the slowest response a user experiences, even one delayed action can impact overall performance. By prioritising visible content, deferring non-essential scripts, and optimising how external tools run, websites can deliver faster interactions, smoother navigation, and stronger Core Web Vitals scores.

Step 5: Shorten Request Chains

Request chains affect Core Web Vitals performance by creating sequential dependencies that delay critical resources. Your content loads slowly because each dependent request in a chain adds to the overall delay.

Displaying important visual content quickly is essential for a fast and smooth user experience. One effective approach is ensuring that the styles needed for the visible part of a page load immediately, while less important styles load later in the background. This allows users to see and interact with content without unnecessary delays.

Similarly, prioritising key resources such as fonts and images helps browsers load what matters most first. When these elements are discovered early, pages render faster and feel more responsive. It’s important to focus only on resources that appear in the initial view so loading priorities remain balanced.

By delivering critical styles upfront and loading secondary assets intelligently, websites can reduce render delays, improve perceived speed, and create a more seamless experience that supports stronger Core Web Vitals performance.

Step 6: Avoid Redundant Server Connections

Your website’s performance takes a hit every time it connects to a different domain. This directly affects Core Web Vitals. Load times and user experience can improve dramatically by cutting down these extra server connections.

Host assets on the same domain

Something that might seem counterintuitive can give you quick performance gains: self-hosting all static assets instead of using external CDNs. New TCP connections to different origins need DNS resolution, TCP handshakes, and TLS negotiation. These add substantial overhead.

Loading assets from external domains can be 1.65× slower on fast connections and add 311ms to load times. The situation gets worse on slower 3G connections, where externally-hosted assets take up to 1.765 seconds more to load.

Developers often think that linking to popular libraries on public CDNs helps users through cross-site caching. The connection penalty today is nowhere near worth this theoretical advantage. The best performance comes from hosting all critical assets on your main domain with a CDN that serves your entire site.

Use HTTP/2 for multiplexing

HTTP/2’s multiplexing brings a transformation in how browsers request resources. HTTP/1.1 needed multiple connections for parallel requests. HTTP/2 lets multiple streams of data flow through a single connection.

The results are impressive. About 74% of HTTP/1.1 connections carry just one HTTP transaction. This number drops to only 25% with HTTP/2. Such efficiency cuts down memory and processing needs from client to server.

HTTPS implementations benefit greatly from this improvement. Each new connection usually needs resource-heavy TLS handshakes. A single reused connection eliminates these extra security checks and boosts throughput.

Exploit DNS caching

DNS caching keeps domain lookups in memory. This removes the need to query DNS servers repeatedly for the same domains. The browser, operating system, router, and ISP all handle this caching.

The advantages include:

  • Faster resolution: No more 20-120ms lookup delays with cached DNS responses
  • Reduced network traffic: DNS queries across the network decrease
  • Better bandwidth utilisation: Less DNS overhead frees up bandwidth for essential content
  • Improved scalability: Traffic spreads more evenly across servers with DNS caching

The right Time To Live (TTL) values will give you optimal DNS performance by balancing freshness with speed. This keeps DNS records cached properly throughout the caching ecosystem.

These strategies will remove connection bottlenecks that quietly work against your Core Web Vitals optimisation efforts.

Step 7: Use 103 Early Hints for Faster Loads

103 Early Hints brings breakthrough technology to speed up Core Web Vitals scores. This innovative HTTP status code lets browsers receive resource hints before the main server response arrives. The technology uses “server think-time” to start loading critical resources earlier.

How Early Hints work

Browsers receive a preliminary HTTP response (status code 103) before the final response arrives. This lightweight, non-final header contains preload or preconnect instructions for critical resources such as stylesheets, fonts, or JavaScript. Browsers start loading these specified resources while the server generates the main page.

The browser requests a webpage, and the server sends back a 103 Early Hints header right away.

When to use them

Core Web Vitals see major improvements with Early Hints. LCP images load 45% faster with this technology, and stylesheet inclusion brings even better results. One test showed LCP time dropping from 3.2 seconds to just 2 seconds.

Early Hints work best for:

  • Top landing pages where user sessions begin
  • Pages containing render-blocking resources like CSS and fonts
  • Resources that affect LCP and FCP metrics heavily
  • Stable assets with infrequent changes

Note that Early Hints only work with preload and preconnect resource hints sent from the main document through HTTP/2 or HTTP/3.

Server configuration tips

Your server needs a specific setup for Early Hints. Most websites can choose from these options:

  1. Cloudflare: The easiest option available. Head to Speed → Optimisation to turn on Early Hints.
  2. NGINX: Add the early_hints directive:
  3. Apache: Special modules handle this setup (technical expertise needed).

Browser compatibility matters in your implementation. Chrome supports Early Hints from version 94. Proper configuration helps avoid issues with older browsers.

Early Hints shrink the wait time between request and render. The result? Better Core Web Vitals scores you can measure.

Step 8: Implement the Speculation Rules API

The Speculation Rules API helps speed up how users move between pages. This powerful tool tackles performance issues that regular Core Web Vitals optimisation misses. Your multi-page site’s performance can be revolutionised when browsers preload future navigations.

What is the Speculation Rules API

Websites can improve navigation speed by preparing certain pages in the background before users click on them. By anticipating likely user actions, browsers can begin loading key pages early, making transitions feel faster and more seamless.

This approach is especially useful for websites where users move between multiple pages, as it reduces waiting time during navigation. When applied thoughtfully, background preparation helps create a smoother browsing experience, improves perceived performance, and supports better user engagement across the site.

Prefetch vs. Prerender

The API offers two ways to load content ahead of time:

Prefetch downloads just the HTML of target URLs without loading the page or its resources. This boosts Time to First Byte and paint metrics like LCP.

Prerender takes things further. It downloads the HTML, all resources, and builds the entire page in a hidden tab. Users see the page almost instantly when they click through.

Your device capabilities, how sure you are about the next page, and page complexity should guide your choice between these methods.

Best practices for implementation

Here’s how to get the most out of the Speculation Rules API:

  1. Control timing with the eagerness property. You can choose from “immediate” loading as soon as possible to “conservative” loading on mouse-down.
  2. eCommerce sites should prerender high-value pages like product details from search results or popular categories.
  3. Mobile devices and slow networks need more careful handling to save bandwidth.
  4. Keep personal data safe by avoiding prerender on checkout or account pages.
  5. Run A/B tests to measure how the API affects load times and conversion rates.

A well-implemented Speculation Rules API gives you better Core Web Vitals scores for page navigation. Users get an instant experience that basic optimisation just can’t match.

Step 9: Audit and Remove Unused Plugins

Plugins are vital to website functionality, but they can severely affect your Core Web Vitals scores, especially when you have to measure INP metrics. You can achieve quick performance improvements by identifying and removing plugins you don’t need.

How plugins affect INP

Your INP score suffers direct damage from excess plugins through several mechanisms. User clicks or interactions with your site, make plugins compete for attention on the main thread, which leads to slow responses. This occurs because:

  • Each active plugin adds scripts that must be processed before your site responds to interactions
  • Heavy JavaScript execution from plugins blocks the main thread
  • Complex DOM operations and style changes from plugins delay visual feedback
  • Third-party scripts from plugins fire multiple events right when users interact

Inactive plugins take up valuable disk space and slow down database queries while increasing backup times. Outdated plugins create security risks while adding to performance bottlenecks.

Tools to identify unused plugins

You can audit your plugin collection with these tools:

  1. WordPress sites let you see unused plugins in the Plugins section under the “Inactive” tab
  2. Plugin Organiser helps control which plugins load on specific pages
  3. PhpMyAdmin helps identify orphaned database tables from previously removed plugins

Streamlining your tech stack

Start with regular plugin audits every 3-4 months, or monthly if you run high-traffic sites. Create a complete backup of your files and database before removing anything.

The best approach is to deactivate and then delete plugins rather than just deactivating them. You can handle multiple plugins at once using the “Bulk Actions” dropdown.

Clean up any remaining data after removal. Plugins often leave orphaned database rows that add to database bloat even after uninstallation. Advanced Database Cleaner helps remove unnecessary database entries.

Your INP scores will improve substantially as you manage your plugins carefully and reduce main thread blocking.

Step 10: Measure and Monitor Your Core Web Vitals

You need to monitor your Core Web Vitals to keep your website performance at its best. A regular check of metrics helps you track optimisation progress and identify areas that need attention.

Using PageSpeed Insights

PageSpeed Insights (PSI) combines lab and field data analysis as your starting point. The tool uses Chrome User Experience Report (CrUX) to show ground performance metrics and groups them as Good, Needs Improvement, or Poor. You can understand your users’ most frustrating experiences through the 75th percentile values reported for all metrics. The daily updates from PSI give you fresher insights compared to monthly BigQuery datasets. Your site must score “Good” 75th percentile values across all three metrics (LCP, CLS, INP) to pass the Core Web Vitals assessment.

Using GTmetrix

GTmetrix adds value to PSI with its detailed visualisation features. The tool shows Web Vitals measurements next to interactive Waterfall Charts that detail each element’s loading time. GTmetrix’s reports include CrUX data tracking that shows your actual visitors’ experience over six-month periods. You can start with the free version’s simple testing, while premium plans give you multiple test locations and mobile testing at INR 843.80/month.

Setting up performance alerts

Automated alerts make performance monitoring work better. GTmetrix and JetOctopus let you create condition-based alerts that notify you when pages don’t perform well. You get notifications through email, Slack, or SMS with links to detailed reports that explain the issues. Chrome DevTools has added immediate Core Web Vitals monitoring features that show updated metrics during your browsing session.

Conclusion

Core Web Vitals are the lifeblood of successful website performance strategies. This piece explores ten practical steps to optimise your site for these significant metrics in 2026. These optimisation techniques create a seamless user experience that both visitors and search engines reward.

Your website’s performance affects your bottom line directly. Low Core Web Vitals scores damage search rankings and push potential customers away. Quick-loading, responsive sites attract more traffic, keep users longer, and achieve higher conversion rates.

Your INP scores improve dramatically when you reduce DOM size and remove unused plugins.

Today’s users expect more each year. Sites that were “fast enough” in 2023 feel slow now. Websites need to keep up with performance best practices to stay competitive.

The best results come from targeting high-impact changes first. LCP optimisation shows the most noticeable improvements, followed by CLS fixes. Once you handle these basics, you can enhance INP scores and add advanced features like the Speculation Rules API.

Great Core Web Vitals scores need steadfast dedication, but the results prove their worth. Fast websites make happy users who become loyal customers. These ten steps, when applied systematically, will revolutionise your website’s performance and business outcomes. 

A fast website isn’t just nice to have; it’s essential. Digital Tokri offers expert solutions to improve your Core Web Vitals and overall site speed, ensuring your users enjoy seamless browsing every time. Partner with us to future-proof your website and boost your digital presence.

NEXT POST

Subscribe to our Newsletter

Get free weekly digital marketing guide