Core Web Vitals Optimization

How do you optimize Core Web Vitals metrics on a site? Is using the NitroPack plugin for PageSpeed Insights page performance optimization part of Black Hat SEO? How to make the user’s experience with the site the best it can be?

In this post, we’ll take a closer look at where to get real data on evaluating basic web metrics and site speed. We will also learn about ways to improve website speed and performance. We will take a closer look at the popular Nitropack plugin – its advantages and disadvantages. We will also show alternative methods of improving website performance.

PageSpeed Insights

Tests such as PageSpeed Insights are very useful for identifying areas for improvement However, such live page checks do not take into account how a page actually behaves with real users, using real devices.

To really get an idea of how your site is performing, you need to use data from users (real users in a real environment). Interestingly, such data can also be seen directly in the PageSpeed Insights tool. Instead, this is information  coming from CrUX. About it in a moment. Whether real data is available or not depends, in simple terms, on how much traffic your site has generated in the last 28 days.

It’s important to know that the so-called live check in the PageSpeed Insights tool only takes into account the mere loading of your site without interaction with it. Unless you can replicate these results in a live test with real users, you won’t see any benefit from the dry numbers in PageSpeed Insights. Neither in Google ranking (page position in the search engine), nor in conversion growth.

You can partially outsmart the lab tests by using plugins like Nitropack, but that doesn’t matter to Google. Ultimately, it’s the user experience that matters.

CrUX

Chrome User Experience Report (CrUX) is a public dataset, created by Google, of metrics depicting user experience. CrUX uses data from the Chrome browser to measure the quality of users’ interactions with sites.

Chrome User Experience Report is based on actual data from users who have agreed to share their browsing history, have not established a Sync password and have usage statistics reporting enabled.

Data on Core Web Vitals metrics from the CrUX tool is the most accurate way to measure a site’s user experience. Unlike lab tests, CrUX takes into account how a site actually responds when users scroll and navigate through it. It also takes into account the speed at which the user receives the site’s content.

The results based on lab data using Lighthouse that your client will see are very impressive at first. The same is true after Nitropack is configured. On the other hand, 28 days later, the “field” results collected in CrUX can differ significantly.

Gaining good results in the “field test” on real users that CrUX provides is the real goal of optimizing Core Web Vitals and getting a positive effect in SEO.

Where to get Core Web Vitals reports?

To access the Chrome User Experience report, you can use the PageSpeed Insights tool or log into Google Search Console, accessing the Core Web Vitals report. For the first option, you will need to check individual URLs one by one, or at least each based on a similar layout.

The second approach is much better. Inside Google Search Console, you can see a summary of problematic URLs. The Basic Web Indicators report contains information about the indicator that is causing the problem and causing the entire CWV test to fail. This way, of course, you won’t examine sites you’re not affiliated with. You need access to Google Search Console.

Inside GSC , a tool for webmasters, you will be able to see a list of subpages of your problematic site with a low LCP, FID or CLS index. In the report, you will also see aggregate LCP, FID and CLS data for good-quality pages.

The report will also give you an overview of your site’s LCP, FID and CLS.

Lab-tools-to-measure-Core Web Vitals

Using lab tools is the best approach to detecting performance-related errors before they occur. Chrome DevTools and Lighthouse are two tools that can be used to measure and test Core Web Vitals in a lab setting.

As Google itself says:

Although lab measurements are an essential part of delivering great experiences, they are not a substitute for field measurements.

The capabilities of a particular device, the type and quality of the Internet connection, other processes that may be running on the device, and how the user interacts with the site all have a significant impact on site performance. In fact, each of the Core Web Vitals metrics is susceptible to user interaction.

Thus, measuring CWV in the field is the only method that can provide an accurate representation and picture.

What is NitroPack?

NitroPack is a website speed optimization tool that was initially developed for OpenCart. It now also supports the WordPress and Magento platforms. For the WordPress system, Nitropack has created a dedicated plug-in to make implementation easier and faster.

NitroPack is a cloud-based service that saves the resources of the server where the website physically resides. The free NitroPack plugin, which you download from WordPress.org, simply helps you connect your site to NitroPack’s servers.

The service offers many optimization features, such as caching, image optimization, smart resource loading, built-in CDN, code optimization, lazy loading and a number of other enhancements.

NitroPack is extremely easy to set up – you don’t need any technical knowledge or hire an expensive programmer.

Minuses of using NitroPack

• It is usually more expensive than WPRocket or other plugins
• The Pagespeed Insights score is excellent, but that’s not always the key; it’s just lab data
• Codes from other vendors may not work properly
• Your site may be broken by using Nitropack (due to its JavaScript code optimizations), so you still need a number of tests
• Nitropack will not fix poor hosting
• Mediocre optimization and image compression
• SEO of images on Google may suffer significantly if you use a CDN (content delivery network)

Pluses of using NitroPack

• No programming skills required
• Fast and fairly easy to implement
• Major CMS like WordPress, WooCommerce, OpenCart, Magento are supported
• It is not optimal and it is better to precisely fix the source of the problem
• May not be enough to pass Core Web Vitals; it depends on site design

Optimizing Core Web Vitals indicators by example

In Google Search Console, in the Core Web Vitals section after checking, I see that CWV is not credited. This only applies to desktop devices (computers/desktops). I also have information that this is due to the CLS value being too high, which is 0.14 for the site under investigation.

The CLS (cumulative layout shift) metric is used to assess the visual stability of a site’s layout. Sites should have a CLS value of 0.1 or less in order to provide a high-quality user experience, according to Google.

The CLS value is 0.1.

To evaluate CWV metrics, the percentile 75 (otherwise known as the third or top quartile) is analyzed. This is the value at which 25% of the results are above this value and 75% are below this value.

The value is the percentage at which 25% of the results are above this value and 75% are below this value.

Ok, now it’s time to identify what causes such a high CLS value. We can use Lighthouse in the Chrome browser for this purpose.

Ok.

To use Lighthouse, go to your site and click Ctrl+Shift+C. This will give you access to the developer tools. Then switch the tab to Lighthouse and run the test. If you lack technical knowledge and don’t want to get into it, you can start with the aforementioned PageSpeed Insights.

In Lighthouse, I can see for the case under review that the dynamically loaded Facebook page widget seriously affects CLS. We can set a fixed width and height for this div element to avoid offsets. This will reserve space for the widget, which will recharge after a few seconds. There are a few other things to improve, but we can fix the most important one and wait and see if it’s enough.

Unfortunately, sometimes we need as much as 28 days to see the fixes in the CrUX report, and thus in the data from real users.

Is Nitropack bad?

No, Nitropack is not bad. It has its pros and cons, just like any other plugin or tool. It is up to the user to decide if it is suitable for his site.

If you’re looking for a quick and easy way to improve your site’s performance, NitroPack may be worth considering. If you need a quick solution without delving into the technical aspects, “go for it” and watch the results.

If you need a quick solution without delving into the technical aspects, “go for it” and watch the results.

However, Nitropack is usually not enough to pass Core Web Vitals. So if you are looking for a more comprehensive approach and want to fix the source of the problems, you should choose other solutions.

Ways to optimize Core Web Vitals

Start with the basics, that is:

1. Take care of fast, reliable hosting. Vultr is one of the recommended hosting for, among others, WordPress CMS, but also with other scripts. High Frequency is a really powerful option. If you don’t have a technical person on your team to manage the server, you can choose an off-the-shelf solution Cloudways with Vultr, which takes care of the management and will simplify the process.

2. Take advantage of fast DNS. You can easily compare the performance of Cloudflare with OVH, for example here

3. Compress and optimize the images – either locally or using a plugin. I have already written about image formats in SEO in a recent article.

4. If you decide to use a CDN, use one.

5. Hire Technical SEO and a programmer if you don’t want to delve into the technical aspects of website optimization.