How Our Site Passed Core Web Vitals in just 7 Days

It’s April 30, 2020; the Core Web Vitals was officially introduced to the webmasters. I have started working on this site Bloggingio to improve the Core Web Vitals Score.

I did a lot of optimizations and tried different tech stacks. Later, I made one final change, and then the site passed the Core Web Vitals in just seven days.

I am documenting my every move here to give you a clear idea to improve your sites.

Before Core Web Vitals

This site bloggingio.com was hosted on FastComet for more than five years, and I was pretty much satisfied with the service. However, a shared host does not offer faster performance. The TTFB of my site is inconsistent, and it oscillates between 150 – 450ms. Since the Core Web Vitals (CWV) is based on field data, your host should be fast as possible.

So, I planned to move the site to a faster host. I have been using Liquid Web VPS since 2015 to host my other sites. Their servers are reliable and offer good performance compared to shared hosts. I moved the site bloggingio.com to Liquid Web VPS after the 10th day of Core Web Vital’s official announcement.

May 2021 with Cloudflare Full Page Caching

The site bloggingio.com gets worldwide visitors, and I need a CDN to reduce the TTFB for a global audience, as my physical server was located in the USA. I started using Cloudflare free CDN. Instead of improving the TTFB, the free plan increased the TTFB as their free plan has a lot of routing issues where the free users are routed through different countries, and it badly affected the whole performance of my site.

To fix this, I started using Cloudflare CDN Full Page Caching, which can produce sub-100ms TTFB across the globe.

The site was live with the above setup for 30 days; however, there are no big improvements in our metrics. So, I moved to the next step of using Cloudflare Pro.

June with Cloudflare Plus

In partnership with Cloudflare, Liquid Web offers an exclusive plan where Cloudflare Pro ($20/ month) is available for just $10/month. Hoping for better results, I started using Cloudflare Pro in June with Full Page Caching.

It comes with mobile speed optimization and image optimization features like Polish and Mirage, which I believe a good options to pass the Core Web Vitals.

However, I was wrong. There are only little improvements, like a 10-point increase in PageSpeed Score, as the image optimization features are good. However, the routing issues are the same, and my site was delivered from Lahore (Pakistan) and Singapore POP instead of their seven Indian POPs. The case was the same when I checked the site from Australia and Europe; the traffic was routed through long paths.

July with Argo Routing

The only option left with Cloudflare is to try their Argo Routing, which promises to use a less-congested network path to reduce latency and improve load times. I bought the Argo add-on for $5 per month and used it for the next 30 days.

However, there are no improvements. While Cloudflare Argo showed graphs on how the latency is reduced, it doesn’t help us pass the Core Web Vitals.

August with StackPath

As there is nothing more to try with Cloudflare, I went with StackPath CDN. The reasons for choosing StackPath are simple. They offer faster TTFB than Cloudflare and are also cost-effective. Here is the data to prove my point; compare it with the above Cloudflare TTFB image.

StackPath is at least 15- 30 ms faster than Cloudflare, and I really enjoyed using them. The biggest drawback is they don’t have an Indian POP which affected the TTFB in the location, so there are no improvements in the LCP score. Since 30% of my traffic is from India, the field data remains the same, and I didn’t pass the Core Web Vitals Score even after using them for 30+ days.

Note: If your 90% of traffic is from the United States, then StackPath is a great option, and I highly recommend them over Cloudflare or other CDN providers.

September with Templ

By September 22, 2020, I had moved the site to Templ hosting. A brief story, they reached me in April to test their hosting services. I tried their services on a demo site for three months and wrote a detailed Templ review here.

Impressed by their performance, I thought of using them for the site Bloggingio.com. So, I bought a hosting account and moved to the site bloggingio.com by September 22, 2020, which you can confirm from the above image.

The Templ tech stacks come with the Google Cloud Platform, CDN, and DNS; it looked promising to me.  Once the site migration was completed, I changed the DNS from Cloudflare to Google, and the site was live on the Templ Platform.

Passing Core Web Vitals in seven days

I didn’t expect the results quickly; the site bloggingio.com passed Core Web Vitals in just seven days. The site has been on Templ since September 22, 2020, and the Search Console data from October 1, 2020, shows all the URLs are moved to “Good” from “Needs improvement.”

The most luxurious thing I’ve ever experienced is that I didn’t implement any optimizations, yet the scores are automatically improved. WP Rocket and PerfMatters are the only two speed-focused plugins that I’ve been using for a long time.

Even pages using Thrive Architect have passed “Good” (It’s usually hard to get a passing score if the page uses page builders like Elementor, Architect, etc.)

Comparing the data of June 2020 with October 2020: Only 53.26% of URLs had good Largest Contentful Paint in June, while a whopping 90.68% of the URLs were good by October.

When 36.9% of URLs were poor by June, it got reduced to 2.22% of URLs by October. On the other hand, only 29.59% of URLs were good by June, and it went up to 67.83% in October.

The site didn’t have any issues with First Input Delay and Cumulative Layout Shift, so I didn’t add screenshots for it.

METRICS	JUNE 2020	OCTOBER 2020
Largest Contentful Paint	53.26%	90.68%
Poor URLs	36.9%	2.22%
Good URLs	29.59%	67.83%

As you can see, Templ improved our scores in no time. However, it doesn’t mean all sites hosted on Templ passes CWV automatically. I optimized my site from caching to other speed optimization techniques available.

If you believe you’ve optimized your site, but it’s not passing Core Web Vitals, then try Templ and see how it works.

How did Templ help us to pass “Core Web Vitals”?

According to Google Web.dev, the reasons for poor Largest Contentful Paint are

• Slow server response time
• Render-blocking CSS and JS
• Slow resource load time.

The slow server response time can be improved by either choosing a fast CDN on top of your existing host or choosing a new Fastest WordPress hosting. Templ hosting produced the fastest server response time and helped improve LCP.

The second way is to use fast CDN. According to CDNPerf, Google CDN is the fastest CDN in the world with the fastest query speed. Note: 5centsCDN is used for live streaming so you can ignore it.

If you’re wondering why I’ve shared this data, Templ is the only host that uses Google CDN. Our test proved that Templ offers a fast server response time even without the CDN. Now, when you use Google CDN over Templ, it provides the best-in-class performance.

What should you do to get a pass score?

The best way to get a pass score in Core Web Vitals is to use the fastest hosting / CDN combined with speed optimization plugins like WP Rocket and Perfmatters.

With the above combination, I’ve passed Core Web Vitals on more than five sites. Not only Templ, but you can also use any other fast host. However, keep an eye on CDN.

No matter how robust your servers are, CDN is the one that is going to connect the end-user with your server. The CDN should be powerful as it takes care of Time to First Byte (TTFB), which paves the way for a good Largest Contentful Paint score.

I don’t recommend Cloudflare free or any paid plan. I took this decision not only based on my personal experience, but I went through many sites, and their TTFB speed is inconsistent, and the cache-hit ratio is not excellent.

The list of things I did to pass the core Web vitals are

• Fast hosting with fast CDN via Templ:
• Delay JavaScript execution via WP Rocket.
• Removed unused CSS/JS per page via Perfmatters.
• Image Optimization using Shortpixels.
• Preconnect external resources and preload fonts.
• Eliminate render-blocking CSS and JS.

Here is how you can replicate my process and improve the Core Web Vitals.

Fast hosting with fast CDN via Templ

The first step is to move your site to Templ hosting free of cost for 60 days. Ask the company to enable Google CDN with full page caching for maximum performance. Additionally, they will perform a premium speed optimization service for the newly migrated sites to their platform and share with you the before/after results like the below.

Delay JavaScript execution via WP Rocket.

To perform this task, you should have a WP Rocket premium plan. Once bought and activated, open WP Rocket settings, Navigate to “File Optimization Menu” and then enable the “Delay JavaScript Execution” option.

Removed unused CSS/JS per page via Perfmatters.

The Perfmatters (premium) or WP Asset CleanUp (Free) plugin is required to perform this action. Navigate through the plugin settings and enable this option to remove unused CSS.

Under the Script manager option, you can disable any Unused JS on the site.

Image Optimization using Shortpixel.

Shortpixel is an image compression plugin that reduces the image size to nearly 50%. Thus, if you use multiple images on the site, the page size will increase abruptly, and Shortpixel will help you reduce the page size.

Get started by installing the Shortpixel plugin (free) and using the default settings. Hover over the Media option in the WordPress admin panel, and click the “Bulk Shortpixel”.

Run the bulk process to optimize the existing images on your site. The plugin will automatically optimize any new images added to the post.

Preconnect external resources and preload fonts.

Eliminate render-blocking CSS and JS.

Find the below settings in WP Rocket to eliminate render-blocking CSS/JS.

Concluding

Overall, Templ is a great host to improve your server performance and get a pass in Core Web Vitals. Also, it’s not guaranteed to get a passing score with Templ, as many field factors are involved.

However, if you’ve tried a lot of solutions and nothing worked, then try Templ, just like me, and see how it goes. You can start using Templ hosting with $30 free credits if you sign up with this link. And then share your experience in the comments.