When it comes to testing the results, GTmetrix is one of the best alternatives to PageSpeed Insights.
At OSC, along with other performance testing methods, we use GTmetrix every day to support our customers inspect their pages and apply their feedback.
While PageSpeed primarily concentrates on colours and ratings, GTmetrix has a classic GUI to direct users in its suggestions and its waterfall is the big one.
Many configuration options (test server area, browser style, etc.) make the GTmetrix experience complete and dependable.
In this guide we will dive deeper into GTmetrix and you will discover why it is a very valid tool to determine the actual performance of the website.
2.Working of GTMETRIX
We suggest the first thing that is to create a free account before you check the performance with GTmetrix.
It helps you to configure the test and get a more consistent outcome in results.
How to tailor the check on GTmetrix?
There are various options you can configure to tailor your GTmetrix research experience. Let’s dig into them.
Location (Test Region)
There are 30 evaluation servers which can be accessed. The first move in achieving reliable results for speed tests is to choose a place as close to your server as possible.
It suggests that checking your speed from Canada will give you a deceptive outcome if your server is based in Europe unless you are targeting Canadian viewers too. Don’t forget to enable a CDN at your site in this case!
You can locate the positions of GTmetrix Servers here.
You can choose between:
Broadband (slow, fast, and normal)
3. HOW TO READ GTMETRIX TABS AND INTERPRET THEIR RESULTS
Next, you have a summary of the options you have selected for testing:
This is why you will see the official results (GTmetrix does not measure one by itself) on the left, and page details on the right:
4. Diving into the Waterfall Chart of GTmetrix
This includes either script, media file or external tool that is included in the page being tested
For each file, you have a load time, represented by horizontal bars: the longer the row, the slower the request for download / execution takes.The GTmetrix Waterfall Chart is composed of five columns, from left to right:
- The requested resource file name.
- HTTP Response Status retrieved from the server for that tool.
- Source file, this is where the resource comes from.
- For each resource, file Size.
- Load Time Breakdown, which represents the time it takes for each resource to download / execute.
If you hover over the file name, you can read the entire path of the selected file. And if you Ctrl+Click on it, you can open the file in a different tab, to identify it better and see its content.If you are using WordPress, it’s going to be easy to grasp if that file comes from one of the plugins or themes that you use.
At this point, there is a very clear picture before you of how well the website is doing.
Until heading to the load breakdown segment, keep an eye on the Fourth column, the file size.
Note down the file and try to fix it when you find large file sizes.
Load Time Breakdown
The color code designed by GTmetrix is useful for differentiating the different parts of the loading process for each resource.
Hovering on the load time bar for each resource will open a pop-up where the various phases of the loading process of the resource are expressed in different colours.
GTmetrix also indicates the event timing in addition to the relative time of each phase of request execution, which is the specific timing at which certain milestones are reached.
There’s also a color code for event timings:
- A green line represents the moment when the screen (initial paint) begins the very first rendering;
- The blue line shows when the user finds the DOM accessible;
- The red line is the Onload, that is when the user installs and executes the website and all of its components;
- We see the fully loaded case with the purple line: the Onload has shot and there has been no network operation for 2 seconds.
Some of these lines often occur in the next GTmetrix column, which is named Timings.
The Timings tab
You can see the information contained therein in the image above. The time required for eventual redirections, links and the duration of the bottom end will also be indicated. You will then be able to see how long Time to First Bytes takes, accompanied by immersive time from DOM, First Paint, Contentful Paint, activated DOM and Onload.
What we like most is the time taken by the GTmetrix team to explain the definition of each metric in plain English.
So useful to get a first basic education on a complex page loading process!
Video and History are the last two tabs to any GTmetrix chart.
The former captures a screenshot of your website loading (including bottlenecks), while the latter displays the performance history of the same page checked.
In this article, you have to learn GTmetrix, one of the best performance testing tools you can use as a PageSpeed Insights substitute (or alongside).
The good thing about GTmetrix is that it includes not only immediate pace and efficiency metrics (such as loading time in seconds, and scores), but also a comprehensive set of categories to explore: from the Waterfall Charts to the Event Timings, to the Timings page, plus a bunch of excellent observations and performance measures explanations.