GTmetrix is one of the most popular website speed and performance testing tools. It scans your website to test its performance and provides you with specific recommendations for issues (if any).
Until recently, GTmetrix used the outdated PageSpeed and YSlow libraries to score your website and suggest best practices for web performance. While these libraries are great at measuring how well you’ve built and optimized your webpage for speed, it doesn’t measure the webpage’s actual performance and load speed for real users.
To fix this drawback, GTmetrix is updating its algorithm to use Google’s latest Lighthouse metrics, which uses field data given by Chrome User Experience Report (CrUX).
In this article, you’ll learn the key features of Lighthouse metrics and how GTmetrix is integrating them in its new reports.
Sounds exciting? Let’s begin!
What is GTmetrix?
GTmetrix is a free website speed and performance testing tool. It’s built by Carbon60, a managed cloud hosting company based in Canada. GTmetrix analyzes webpages using various web performance standards and gives you various recommendations on how you can optimize their code.
You can learn more about GTmetrix and how it tests webpages in WP Rocket’s in-depth GTmetrix guide.
What is Lighthouse?
Lighthouse is Google’s open source tool for enhancing the quality of webpages. Unlike Google’s older PageSpeed Insights tool, Lighthouse analyzes a webpage in multiple ways. You can use it to test any URL for not just performance, but also accessibility, SEO, adherence to best web practices, progressive web apps, and more.
Lighthouse focuses on user experience as a benchmark to define its metrics. All its metrics focus on evaluating how users are experiencing the webpage, and not merely measuring how fast the page loads. Here, the user’s perception of webpage performance is more important than raw stats that can give a skewed view.
Google calls these metrics Core Web Vitals. The new GTmetrix Report will also feature these Core Web Vitals.
Note: Google still offers the PageSpeed Insights performance testing tool, but it has now shifted to use Lighthouse as its core performance analysis engine.
What are Google’s Core Web Vitals?
Web Vitals is a Google-led initiative to help site owners understand the experience they’re delivering to their visitors. It aims to cut down complex metrics and focus only on those that are more important, the Core Web Vitals.
Core Web Vitals are metrics that all site owners should pay attention to. As of now, there are only three Core Web Vitals, each focusing on a distinct aspect of user experience.
- Largest Contentful Paint (LCP): This measures your webpage’s perceived loading performance. It’s the time taken to render the page’s largest above-the-scroll element. An LCP score below 2.5 seconds is good, but it’s considered poor if it’s above 4 seconds.
- First Input Delay (FID): This measures your webpage’s interactivity experience. A FID score of less than 100 milliseconds is good, but if it’s above 300 milliseconds, it’s deemed poor.
- Cumulative Layout Shift (CLS): This measures your webpage’s visual stability. A CLS score of less than 0.1 represents pleasant user experience, but 0.25 and above is poor.
The metrics that define Core Web Vitals may evolve to reflect user experience better. Google has also hinted that Core Web Vitals score will play a significant role in their page ranking algorithm. Hence, they’ll be important for your WordPress site’s SEO.
GTmetrix Legacy Reports vs New Reports
GTmetrix’s Legacy Reports may look similar to the new GTmetrix Reports, but that’s where the similarities end. These two reports highly differ from each other, both in terms of focus and testing methods.
Let’s compare them on a one-to-one basis and chart out their differences. I’ll mark the important areas with numbers to make it easy for you to follow.
Here’s a detailed explanation of the differences between both the reports
- The Legacy Report ranks individual Performance Scores with 2 letter grades based on the PageSpeed and YSlow libraries. Here, the focus is only on the Structure of the webpage.
The New GTmetrix Report gives a GTmetrix Grade with a single letter grade reflecting the overall website performance. Here you can see 2 percentage scores based on both the Speed and Structure of the webpage. The Speed score is comparable to Lighthouse’s Performance Score, whereas the Structure score is GTmetrix’s assessment of how well the webpage adheres to best practices.
- The Legacy Report shows you Page Details with raw stats such as Fully Loaded Time, Total Page Size, and the Number of Requests. These stats don’t give you an idea of what the average visitor on your site experiences.
The New GTmetrix Report shows you Core Web Vitals metrics such as Largest Contentful Paint, Total Blocking Time, and Cumulative Layout Shift. These metrics are a fairer representation of the user experience you offer to your visitors.
- The New GTmetrix Report replaces the PageSpeed, YSlow, and Timings tabs from the Legacy Report with Summary, Speed, and Structure tabs. I’ll discuss all the new tabs later.
- On the primary results page, the Legacy Report shows you recommendations based on the outdated PageSpeed library, but the New GTmetrix Report provides a comprehensive summary of the overall test.
As you can see, apart from sharing a few similarities like Waterfall chart, some similar Audits and recommendations, and certain timings, they’re both distinctive.
Here are a few preview screenshots given by GTmetrix on how the 3 new tabs will appear in the report:
The Summary tab displays a brief overview of all the important page speed and performance metrics. GTmetrix also shows you helpful suggestions here based on your site’s analysis.
The Performance section has two sections: Speed Visualization and Timings. The Speed Visualization section displays how the webpage loads in intervals, with important page load milestones highlighted as per their timings. You can see the Timings section below for more details about the milestones.
The Structure tab displays results for various Lighthouse audits related to the Structure of the page. The audits are ordered by the highest impact they can have on page performance.
GTmetrix also provides a Difficulty rating for each audit, so you can quickly grasp how easy it is to fix the issue highlighted. For instance, “Properly size images” gets a 1-star difficulty rating as you can do it easily. Issues that require technical expertise, like “Eliminate render-blocking resources” and “Preconnect to required origins,” have a 4-star difficulty rating.
You can use all the information provided by GTmetrix to optimize your site for best performance.
Fully Loaded Time vs Largest Contentful Paint (LCP)
Historically, Fully Loaded Time was a meaningful metric to measure a site’s performance. But it doesn’t give a full picture of what the user sees on their screen.
For instance, modern sites with a heavy webpage can take advantage of client-side rendering and other web performance techniques to load the most important sections of the webpage first, and then load all the other page assets. Thus, users will perceive the page to load faster, resulting in a better user experience.
Fully Loaded Time metric isn’t always an indicator of user experience (Source: GTmetrix)
Because of issues such as this, the W3 Web Performance Working Group and Google found a more accurate way to measure website performance. The answer is the Largest Contentful Paint (LCP) metric.
Largest Content Paint is a Core Web Vitals metric (Source: Google)
The LCP metric measures the time taken to render the webpage’s largest image or text block visible within the browser’s viewport.
As per Google, the LCP should occur within the first 2.5 seconds of page load to provide a good user experience. Anything over 4 seconds is poor user experience, resulting in increased bounce rates and a SEO penalty.
For this reason, the new GTmetrix Report has replaced the Fully Loaded Time metric with LCP.
New GTmetrix Report vs web.dev/PageSpeed Insights
While the new GTmetrix is powered by Lighthouse metrics at its core, just like other speed and performance testing tools such as web.dev and PageSpeed Insights, there’s more to it than just that.
However, the way GTmetrix implements Lighthouse and its testing methodologies differ from what Google does. Hence, they’ll have varying differences in their results, especially when you test your site on GTmetrix with custom Analysis Options, devices, and locations.
If your website caters to an international audience from around the world, then it’s critical to test its performance from different geolocations. Hence, GTmetrix is also adding 15 new test locations. You can read about them in their blog announcement.
Speed and performance are crucial aspects of offering a pleasant user experience to your site’s visitors. It makes sure that your visitors spend their limited attention consuming your site’s content, and not waste it waiting for the page to load. If your site fails on this front, your hard earned visitors will bounce.
In terms of SEO, Google has hinted that they’ll use the Core Web Vitals metrics in its search results ranking algorithm. Whether you’re a developer, marketer, or a site owner, focus on prioritizing your site optimization for these performance metrics.
Realizing the changing landscape of web performance optimization, GTmetrix is updating its algorithm to make it easier for you to test and optimize your sites. You can make that even easier by getting WP Rocket on your side!
Do you have questions about website performance optimization, Lighthouse metrics, or the new GTmetrix report? Please leave a comment below!