Magazine

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

Posted on the 10 January 2022 by Shamsudeen Adeshokan @cybernaira

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBTCase Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

In this post, you will learn how I managed to score 99% GTmetrics performance score, 0ms TBT (Total Blocking Time), and Core Web Vitals Reports for most of the website pages.

The good news is that there is no complex theory or rigorous steps to follow here.

Everything I did and executed can be replicated by anyone regardless of your marketing experience or WordPress knowledge.

I have tried several performance optimization methods before, but nothing seems to work as great as the tips I will share with you today.

And it doesn't cost you harms and a leg to walk through.

Before I walk you through the steps, for those who don't know what GTmetrics is, here's a brief description of what the tool is.

What is GTmetrics?

GTmetrics is a website performance and page speed testing tool developed by Carbon360. It is one of the few tools along with Pingdom, webpage test, Web.dev that is trusted and used by millions of marketers worldwide.

Initially, GTmetrics uses the pagespeed and Yslow libraries data to run in-depth performance and speed analysis of a website URL.

But since the upgrade in 2020, Google lighthouse (the industry standard for web performance) now powered GTmetrics to run analytics of your website page experience and speed index breakdown.

GTmetrics uses grades and scores. Also, it presents a description of what's slowing down your website pages along with possible optimizations recommendations.

You can use GTmetrics to diagnose, pinpoint, and follow its recommendations to provide solutions to your slow website.

GTmetrics checks your website performance and page speed from multiple server locations - 67 servers from 22 locations around the world.

To learn more about the new GTmetrics Google LigthHouse reports, read the official announcement on the blog.

How Reliable is GTmetrics Score?

As with most page speed and website performance analytics tool that uses the data from the Google Lighthouse, you should expect real-world page load observations.

The performance score for most page speed and performance testing tool that uses Google lighthouse data should be similar. But in a certain scenario, you may see a slightly different performance test report.

This is due to many factors such as latency, network condition, server location, browser, etc. Performance scores and speed tests will vary from tool to tool because of the difference in testing methodologies and configurations.

But you should rest assured that GTmetrics is nearly as accurate as the data you get from the Google pagespeed insight and Lighthouse.

Now that you know what GTmetrics is, it's important you learn how these web pages perform before and after the performance optimization strategies.

Here are some of the GTmetrics performance scores before the optimization process...

Case Study: GTmetrics Performance Score Grade
Case Study: GTmetrics Performance Score Grade
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

Then, here are some of the after optimization GTmetrics performance and Core web Vitals scores...

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

As you can see, these are not flukes or coincident.

These are the result of hard work, experiments, trials, and errors, investments, and a winning on-page SEO strategy.

Now, let me walk you through the steps and strategies I followed to achieve the optimization results.

How I Improve GTmetrics Score And Core Web Vitals Performance

There were only three things I did right to get the best GTmetrix score for this blog, down this post, you will read all the three steps in detail.

#1. Upgrading Hosting Plan

The first thing I did was upgrade this blog hosting plan.

Back in April of 2020, I reported upgrading this blog hosting type from Shared Hosting to the NameCheap EasyWP managed WordPress hosting server.

If you haven't read that post, now is a good time to have a read.

After upgrading to the starter plan on the EasyWP server back in 2020, the blog improves on all levels of website performance - both speed and performance.

Since then, the blog has remained hosted on the EasyWP Starter plan.

Of course, everything was working smoothly until the blog traffic take a bit uphill. During peak traffic times, the page loads a bit slowly, and sometimes, the 5XX Cloudflare connection timed out error codes.

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

I was furious and wanted an improvement.

I began searching for the cause of this. So I started testing and implementing whatever optimization methods I could think of.

After testing several website performance optimization strategies and nothing seems to work, I decide to upgrade the server once again.

At this point, I wasn't sure or convinced upgrading to a higher server plan will have a direct impact on website performance and speed. I just want to see if there could be any performance differences in the server plan.

So I bought the EasyWP Turbo plan and upgrade from the starter plan to the Turbo.

Note: You can try the EasyWP Turbo plan for 30 days free trial offer by clicking here.

The Turbo plan is 1.5x more CPU power, 1.5x more RAM processing power. It comes with a free Supersonic CDN, free SSL Certificate, 200k monthly visits limits, a 50GB SSD storage capacity and runs on the NGNIX server.

After upgrading the server, speed was a significantly noticeable improvement. Also, the Cloudflare 5XX host not working error code was resolved.

But the Core web Vitals assessment score remains unchanged or improved.

So I continue the search for improving the website performance.

Note: I didn't switch to the NameCheap supersonic CDN, rather, I stick with the Cloudflare content delivery network.

#2. Remove WordPress Optimization Plugins

Before I upgrade to the Turbo plan, this blog has the following optimization plugins:

After upgrading to the Turbo plan, I expected an immediate or instant optimization experience. But that wasn't the case.

So, I installed a few more WordPress-known optimization plugins such as Hummingbird. After installing and activating Hummingbird, and running the first scan, the GTmetrics score went from Grade B to E.

And the performance scores down to 42%. The Core web Vitals score was below average on all levels except for Cumulative Layout Shift at 0.02

Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT
Case Study: How to Get GTmetrics Performance Score Grade A and 0ms TBT

At this time, I guess the more optimization plugins I installed, the less optimized the blog.

So I decided to do something different.

Since the EasyWP Turbo plan is 1.5X optimized than the Starter plan and comes with an in-built 3 layers cache system, I decided to uninstall all WordPress optimization plugins on the blog - except for JetPack and JetPack Boost.

I uninstalled Autoptimize, WebCraftic Clearfy, Hummingbird, and BBQ - Block Bad Request (a firewall plugin).

I also uninstalled the official AMP plugin - this plugin has been causing compatibility issues for a long time.

The reason I uninstalled AMP was due to the compatibility issue with several other WordPress plugins - Stackable for one, and the blog's current theme - Authority Pro.

After uninstalling all these plugins, I cleared the WordPress cache and run the web pages through GTmetrics again.

The result was amazing and unbelievable.

At first, I was not certain of the steps to have produced the optimization results. I wanted to be sure of what worked and what did not.

I installed and activated all the above-mentioned plugins to the blog, and run the exact web pages through GTmetrics again.

As expected, the result was all below the average industry benchmark. Most of the pages on average score GTmetrics Grades of D, E, F, and at best, C.

I uninstalled the plugins, cleared the cache, and run the pages again. The pages went from low GTmetrcis performance scores to A and the Core Web Vitals score improved on all metrics.

At this point, I was sure of one thing - the more optimization plugins I installed, the less optimized the blog.

Don't give your judgment yet, I'll tell you what happens in a bit. Continue reading.

#3. Optimize WordPress Images

When Hummingbird was installed on this blog, I'd deactivated the JetPack Site Accelerator service.

Hummingbird was the image optimization WordPress plugin since installed. But after the revelation, the deactivation and uninstallation of Hummingbird and other optimization plugins, I switched back to the JetPack Site Accelerator.

Now the images on this blog are optimized and compressed by the JetPack Site Accelerator and served from its global CDN.

#4. Activating JetPack Boost

Another additional optimization feature that was added is the JetPack Boost.

JetPack Boost is an optimization plugin from the people that gave you WordPress and JetPack.

The free performance optimization plugin allows you to combine and optimize the delivery of CSS and Defer non-essential javascript files without ever touching a line of code.

JetPack Boost is a one-click install and optimization plugin. You don't have to configure or walk through complex settings page to get the plugin to work.

Install, activate and the plugin goes to work.

The plugin also comes with the image lazy-load feature. This helps to delay the display of images until the user scroll to the view-point.

JetPack Boost can also help improve the Core Web Vital Google report.

This is because the plugin makes optimization changes to the way content and files are been sent from your web host server to the user's browsers.

For example, the CSS optimization feature will move the important page styling to the top of the page so they can load more quickly than the rest of the page content.

This enables the user's browser to load the important content faster and doesn't have to wait for all the content on the page to load.

As a result of these optimization changes, the web page will experience faster content delivery, improved page speed, and the Core Web Vitals metrics.

How to Improve GTmetrics Performance Score : Take Away

If you read this content carefully, you will notice that very minimal financial investment was spent here.

Apart from the web hosting package upgrade, every other tool mentioned here is free to use.

The JetPack image optimization feature comes with your free JetPack plugin. Also, the JetPack Boost is a free plugin from Automatic.

Another thing to note here is that JetPack and JetPack Boost are two separate plugins. You don't have to get JetPack to use the JetPack Boost.

Both plugins work separately. None is dependant on the other.

Now, to a very important message you need to get here:

Hummingbird, Autoptimize, WebCraftic Clearfy are all good and powerful WordPress optimization plugins.

I will assume these plugins are not necessary or needed in the EasyWP Turbo hosting environment. This is because the Turbo plan is optimized to provide better performance, speed, and pass the Google Core Web Vitals assessment.

From my own experience, you don't need any other caching plugin with EasyWP managed WordPress hosting.

So if you host with NameCheap, try the Turbo plan and see if you get the same or better GTmetrics performance score than I did.


Back to Featured Articles on Logo Paperblog