Your website’s performance is not just about speed, but how users perceive it. Core Web Vitals (CWV) are Google’s performance metrics that measure user experience, from loading speed to interactivity and visual stability. Your CWV optimization can improve your SEO rankings, conversion rates and user satisfaction.
In this article, we’ll share with you 5 tricks to improve CWV:
- Delay JS on user interaction
- Lazy loading images
- Missing image size attributes
- Remove unused JS/CSS
- INP best practices
What Are Core Web Vitals?
Core Web Vitals (CWV) are a set of metrics that measure how fast, responsive, and visually stable your website looks to users. They’re part of Google’s page experience ranking signals, which makes them a direct contributor to your site’s success in search results.
There are four main metrics to know about.
What is LCP (Largest Contentful Paint)?
LCP measures how long it takes for the most visible element (e.g., a video, image, or block of text) to load on the screen of the user. This should be 2.5 seconds or less. A bad LCP is normally a sign of server latency, render-blocking resources, or unoptimized media.
What is FCP (First Contentful Paint)?
FCP indicates when the first content (text, image, or canvas) is painted to the screen. This gives users a signal that the page is loading. The earlier the FCP, the sooner users perceive your site as fast.
What is CLS (Cumulative Layout Shift)?
CLS measures visual stability, essentially, how much content moves unexpectedly during loading. For example, when a banner or image shifts and causes a user to click the wrong button, something I’m sure we’ve all had the misfortune to experience. A CLS score below 0.1 is considered good.
What is INP (Interaction to Next Paint)?
INP measures how responsive your site feels when users interact with it, for instance, by tapping on a button or expanding a menu. A good INP is under 200 milliseconds. It’s a new metric that replaces FID (First Input Delay) and gives a more encompassing view of user interactivity.
Together, these metrics represent real-world performance and user satisfaction. Optimizing them is crucial for SEO and user experience.
How to Check Core Web Vitals (CWV)
Before you can optimize CWV, you need to measure them. Fortunately, Google provides several tools to accomplish this.
PageSpeed Insights
PageSpeed Insights is Google’s standard tool for assessing your website’s performance. It provides both lab and field data, which means how your website performs on real devices and in controlled environments. You’ll also get actionable suggestions which can be a great time-saver to fix the problem.
Chrome User Experience Report (CrUX)
Use the CrUX Visualizer to access real user data gathered from Chrome users. You can see performance trends in addition to your website’s performance in relation to industry standards.
Chrome User Experience Report (CrUX)
And then of course there is Google Search Console where the Core Web Vitals report displays which URLs are performing poorly on desktop and mobile. It groups similar pages that share the same issues, making it convenient for you to target and prioritize fixes.
Running these tools periodically enables you to notice improvements and also identify new issues as your website evolves. These tools are free and there are many others; there are also paid tools with many more features—choose the one that best suits your needs.
1. Delay JS on User Interaction
One of the most effective tricks to improve CWV metrics is deferring JavaScript execution until a user interacts with your page.
Many sites load dozens of JavaScript files immediately, even before the user scrolls or clicks anything. This delays the Largest Contentful Paint (LCP) and negatively impacts INP since the browser must process all that code upfront.
By delaying non-essential JS until interaction (like a scroll or click), you can drastically improve your site’s initial loading time.
Deferring scripts means your page can render the main content first, making it visibly faster to users and to Google’s crawlers. It’s often the fastest way to improve your scores across LCP, FCP, and INP simultaneously.
However, beware! While this trick works wonders, it’s not a permanent solution. You’re essentially sweeping the problem under the rug. The JS still exists and remains unoptimized. For a long-term fix, you should refactor or remove unused scripts altogether. But if you’re after a quick performance win, this is your best bet. Some scripts are required to properly load the page however so you might need to identify and whitelist these, a staging environment can be a good safe place to experiment with this feature.
2. Lazy Loading Images
Images are usually one of the heaviest assets on any page. Lazy loading allows browsers to delay loading images until they’re about to enter the screen. This reduces initial page load time and bandwidth consumption, improving both LCP and FCP. It is a must have for any modern website, and really improves your CWV a lot.
In practice it’s just about adding a lazy loading tag in the image HTML tags, there are many plugins on WP that offer this feature.
Important side note: do not lazy load images that appear above the fold (the portion visible when loading the page initially). Doing so will delay their loading unnecessarily and will actually hurt your LCP score. Always test to ensure that hero images, banners, and above-the-fold content load instantly.
3. Missing Image Size Attributes
Unexpected layout shifts are one of the biggest frustrations for users and they directly affect your CLS score.
When an image doesn’t have defined width and height attributes, the browser doesn’t know how much space to reserve. As a result, when the image finally loads, it pushes content down or sideways, causing a layout shift.
Fortunately this is easily fixed by simply ensuring all images have sizes so the browser can reserve the required space and you don’t frustrate your users.
If your CLS remains high even after setting image sizes, you might need to look into other culprits like dynamic ads, animations or embedded iframes.
4. Remove Unused JS and CSS
Something important to fully understand is that every time your page loads, the browser fetches all the linked CSS and JS files, even those that might not be used on that specific page.
This is quite a common issue, essentially there are most likely a lot of code or parts of code that are not required to render a page but these are still loaded and take up precious resources.
This unnecessary code increases page weight, delays rendering, and consumes bandwidth. On large sites, global CSS or JS files can easily reach hundreds of kilobytes, even though a single page might use just a fraction of it.
The solution is to ensure only the code required for a specific page is loaded on that page. Different WP plugins can help with this but it requires patience and skill to properly implement. However, it’s one of the most effective long-term strategies for maintaining healthy CWV scores.
5. INP Best Practices
As mentioned earlier, Interaction to Next Paint (INP) measures how responsive your site feels when users interact with it. It’s basically the time it takes from the moment you click on a button until the button reacts.
One of the common offenders is the cookie consent button. When a user accepts cookies, many sites trigger a flood of tracking scripts and analytics tags that execute immediately, freezing the browser momentarily. This spikes your INP and leads to a poor user experience.
To remedy this you can consider delaying scripts that you don’t need immediately and adding async or defer attributes to external scripts. Lastly and most importantly, make sure you are using the different tracking tools for business essential purposes. If you are not using the data then remove the tool. Heatmap type tools for instance are incredibly heavy and although cool you only really need a sample to gather enough data to draw conclusions.
By managing how, when and if scripts load, you ensure smoother interactivity and improve both INP and overall user satisfaction.
Why Technical SEO Matters
Optimizing Core Web Vitals isn’t just a technical exercise, it’s an essential part of a strong SEO foundation. Technical SEO ensures that your website is fast, crawlable, and accessible to both users and search engines. Without it, even the best content and backlinks can underperform because Google prioritizes user experience as part of its ranking system.
Technical SEO allows you to reap the maximum benefits of all other SEO investments and makes sure you are taking advantage of the full potential of your content and link building.
Think of technical SEO as the foundation of a house. If it’s weak, everything built on top, no matter how awesome, will crumble over time.
Once your site’s performance is optimized, it’s time to amplify your visibility. That’s where Search Royals comes in. A strong backlink profile combined with stellar CWV performance is the ultimate recipe for top search rankings. Reach out today to start building your authority and grow your business.
