With Google announcing in recent years that page speed is a key factor in the rankings of search results, there has been more emphasis than ever before on optimising website performance. There are several online tools that can be utilised to give your website the desired performance boost; each with different costings and capabilities. Here, we will look at GTMetrix and how it can help your business.
So, what is GTMetrix? Well, it is a website performance analytics tool, created by GT.net, who are well known in the digital space for the speed monitoring tool, Pingdom. The key objective of GTMetrix is to analyse the performance of your website and provide you with a list of actionable recommendations to improve it.
When getting started with GTMetrix, enter your domain name into their website and let them work their magic. After a short analysis time, you are presented with a performance report with a top-level page speed score, loading time and overall page size. We are also provided with a breakdown of several page speed recommendations as to how you can improve.
The top-level KPIs are great for analysing trends, however, to understand how to optimise our website, let’s go into further detail.
Page Speed KPI
One of the main attractions to GTMetrix is the ability to quickly and easily get access to key performance indicators. Once the analysis is complete, we are provided with the Full Loaded Time, so we can see the amount of time that the website takes to load, in seconds. We are also given the Total Page Size, so we can measure the full size of the page in MB. Finally, in Requests, we are given the total number of assets that the website is using at any given time. By providing us with this useful information, we can use GTMetrix to get a solid understanding of the performance of our website.
One of the KPIs in GTMetrix is the Page Speed score, which is provided as a percentage and graded from A to F. In the breakdown, we get a comprehensive list of over 25 metrics that affect page speed. For each metric, we are given a grade of how well each is performing. Using Image Optimisation as an example, we can click the accordion list to see the recommendations in more detail. We are given a list of every image that is used on the page and provided with a recommendation as to how much each image could be compressed by. Following on with the image optimising example, GTMetrix provides details on the specific type of image compression that should be used as well as creating new and compressed images to be used on your website.
In addition, each metric is given a priority, from low to high, so we can see the most critical actions that should be prioritised. Each metric is categorised so that we can group similar tasks together and see if performance issues lie with specific areas. This can be useful when assessing the performance of your website if the analysis uncovers that several issues come from the same area. Common categories include content, CSS/JS, images and server.
Google’s Page Speed Insights (PSI) offers a similar service and can often be confused with GTMetrix. There are a few subtle differences between the two; for instance, GTMetrix has 7 regional test servers, whereas PSI is Geolocated, meaning that the test results are based on the current location of the user. GTMetrix is based on the original open-sourced Google Page Speed library. Since then, Google made several changes to the scoring algorithm and have not updated the open source version. As a result, we should not compare the results from both of the tools and question why they may differ. Finally, GTMetrix uses real browsers when conducting browser testing, whereas PSI uses emulated browsers. Consequently, emulators are often complex and outdated engines, which means that real browsers provide a better indication of your website’s performance.
Under the YSlow tab, we are given a breakdown that details over 18 common pitfalls that could potentially cause the page to take longer to load than necessary. Page Speed Score and YSlow largely provide similar insights, however, Page Speed Score tends to provide an analysis of the existing setup and how to optimise it, whereas YSlow is more of an assessment of problems and how well your website does to avoid them. YSlow summarises the pages main components and tends to consider more server-related improvements rather than on-page content.
Some of the recommendations that are provided by YSlow include the use of Content Delivery Networks (CDN) so that content is provided to a website from the nearest server available. YSlow also covers the importance of reducing the number of HTTP requests and avoid the use of URL redirects. This highlights the importance of how fixing server-side issues can improve the overall performance of the website.
The same as Page Speed Score, YSlow grades the recommendations based on how the website is performing. YSlow categorises recommendations into Types; common examples are server, content and cookie. Each recommendation is given a priority, so we can see the most important actions straight away.
A great feature of GTMetrix is the ability to view the historical statistics of your website. This history can be updated every time you run an analysis of your website, as well as at scheduled times, so you can get periodic updates of your website’s performance. Scheduled tracking can be set up to run on a daily, weekly and monthly basis to ensure continual monitoring of your website’s performance. It is worth pointing out that one-off speed tests are all well and good, however, it is only when we have multiple speed tests and we can compare the differences that the tests have a proper meaning.
The tracking is visualised with interactive graphs and is split into three main areas: page timings, pages sizes & request counts and finally, Page Speed & YSlow Scores. The graphs can be zoomed and panned or set to a timeframe to show progress over a specific period of time and allow analysis of historical data. Furthermore, annotations can be added to the graph, which can provide additional context e.g. a website redesign, a product launch or a blog post publication. Email alerts can also be set up to notify you if a part of your website is performing poorly, which can be useful when new content is uploaded and inadvertently causes performance issues.
An additional feature of the performance tracking is the ability to scan the website of a competitor and compare the results with your own. By conducting an analysis of our competitors, we can assess the strengths and weaknesses of the website and target opportunities as to how to get ahead. The competitor analysis may flag a recommendation that the competitor has overlooked and provides you with an opportunity to get the advantage. Conversely, the analysis may uncover a shortcoming on your own website and provide a chance to fix the issue that has been flagged.
One of the more underrated GTMetrix features is the ability to analyse your website from multiple regions of the world. GTMetrix provides users with the ability to test the performance of their website on 28 different servers in seven different locations around the world. This feature allows us to test the latency of global internet connections, which is particularly useful if you are a global brand and international performance is essential.
Furthermore, the location of the testing server can wildly throw off the results of a test. Quite often, online speed tools will assign your website to the next available server. If the location of the server was to change from test to test, then the results could be difficult to decipher. It is, therefore, a great advantage to be able to specify the location of the server for every test.
Waterfall and Page Load Video Playback
Aside from the performance tracking charts, GTMetrix enables us to view the performance of our website in waterfall format. The waterfall is very similar to what we can expect to see in the Firebug Net Panel and the Google Chrome developer tools. The waterfall provides us with a with a comprehensive list of every asset that is used on page load, the source of the asset and the loading time for that specific asset. Viewing the waterfall allows us to first understand the order in which content is loaded and potentially delay any content to be loaded after the initial page load. Secondly, the waterfall loading time allows us to see at a glance which assets are taking the longest to load and could potentially be optimised.
In addition to the waterfall, GTMetrix enables us to view the performance of our website in video format. The video provides us with a visual aid that can potentially flag which content is taking the longest to load. The video playback feature allows the load to be played back at a quarter of the original speed to allow us to target issues where there are delays to the loading of specific content.
The playback feature has a few pre-set timers such as First Byte, DOM loaded, on load content and finally fully loaded. Splitting the loading process in this manner allows us to see where the bulk of the content is getting loaded and alter accordingly. For instance, we can monitor the time it takes to load the DOM and monitor how our changes affect the loading time. Also, some content could be deferred so is not required on the page load.
Bonus: CDN Setup
When scanning your website on GTMetrix, it may often flag on the YSlow recommendation that a CDN is not set up. If you already have a CDN created, then we need to tell GTMetrix which type of CDN you are using in order for it to be included in the analysis.
Once signed up to GTMetrix, we can set this up by going to User Settings in the top right corner. Then in the Analysis Options section, go to the YSlow CDN Hostnames input. Here we can insert all of the CDNs that are used on your website, please put one CDN per line. It is worth pointing out that the CDNs are entered at an account level, so if you scan multiple websites from the one account, then please enter all the CDNs for all your websites into this one box. Once finished, click the Save Settings button to make the changes permanent. The next time that you scan your website, the results will be more accurate than ever before.
Overall, if you are looking for a tool that can provide a comprehensive analysis of your website’s performance, then GTMetrix is for you. It provides an in-depth assessment of how your website is performing and provides an extensive list of recommendations as to how to improve. The monitoring tools allow GTMetrix to be more than just a tool that is used on an on-off basis, rather it is an essential part of your online performance strategy continually progressing into the future.
Image Credit: GTMetrix