“A fast website is a good website” is a phrase you’ve no doubt heard time and time again as you’re continually working on improving the user experience of your site, especially as users these days expect websites with lightning fast load times.
But what exactly does “fast” mean in the context of website performance? Well, it can mean a lot of things, and that’s the problem – measuring the performance of your site involves many metrics. So in order to fully understand your site’s performance, you need to grasp what metrics you should be measuring, why, and what you can learn from them in order to optimize your site for better performance.
So in this post, I’ve put together a list of the key metrics you should be regularly monitoring.
Note: I used GTMetrix to measure many of the metrics included in this article, using a basic WordPress site hosted with Cloudways and using WP Rocket’s default settings.
Whether you run a small business or non-profit, an online store or a simple blog, if traffic can’t reach your website because it’s down, then you are effectively closed for business. And that, in a nutshell, is why uptime is a critical concern for site owners.
Uptime is the responsibility of your web host, so if you experience frequent downtime or bandwidth issues, it’s worthwhile reviewing your hosting options. While no host can guarantee 100% uptime, you should be aiming for uptime 99.99% of the time.
Services like Pingdom and Uptime Robot can monitor your site and instantly alert you when it goes down so you can act quickly to get your site back online.
2. Time to First Byte
The time it takes for the first byte of information to reach a visitor’s browser after a connection to the server has been requested is called time to first byte, or TTFB.
This key metric is calculated by adding up the redirect duration (the time spent sending a request to the server), the connection duration (the time spent processing and generating the response) and the backend duration (the time it takes to send the response back to the visitor’s browser).
There are some ways you can improve your site’s TTFB, including optimizing code, implementing caching, fine-tuning your web server configuration, and upgrading your server hardware. The order in which site visitors receive information is also important and can help boost your TTFB.
3. Time to First Paint
First paint (FP) time marks the point, immediately after navigation, when the browser renders pixels to the screen. Depending on the structure of the page, this could be displaying the background color or it could be most of the page being rendered.
Google describes this key metric as important to the site visitor because it answers the question: is something happening?
FP timing is significant because up until this point, the browser will have only displayed a blank page and this state change shows the visitor that the page is loading.
4. Time to First Contentful Paint
First contentful paint (FCP) time is the point when the browser rends the first bit of content from the Document Object Model (DOM), which might be text, an image, SVG or other element.
For site visitors, this timing signifies when actual content has been loaded in the page, and not just any change.
As you can see in the example below from my speed text, the FP and FCP timings are identical as these metrics are closely aligned.
Why exactly is this metric useful for site admins? Like FP, FCP provides an indication of when site visitors receive “consumable” information (text, images etc) and can see that a page is loading and something is happening.
5. Time to Interactive
The time to interactive (TTI) metric marks the point at which the page is both visually rendered and capable of reliably responding to user input. This means the visitor can scroll the page, click on links and complete other interactions. During this loading period, some elements such as scripts might be still continuing to load.
6. Onload Time
7. Fully Loaded Time
8. Connection Time
Let’s back up for a minute and look at connection time. This is the time between a request and when a connection is made between the visitor’s browser and the web server.
There are a lot of different factors that can contribute to connection time, such as heavy server traffic and the visitor’s geographical location. In order to improve your site’s connection time, you might want to experiment with load testing tools like Apache JMeter, WebLOAD from RadView and LoadComplete from SmartBear.
9. Total Page Size
As you can see, the total page size for my test site is 459 KB, which is okay, not great, since it’s a one-pager site with few elements. Obviously, I have a lot of work to do to trim the size down.
HTTP Archive has been collecting information about websites since November 2010 and offers some interesting stats around total page size going back over the years.
Here’s the average size of websites in January 2018:
As you can see, images make up a whopping 51% of websites, while video makes up 24%. The total size of sites has really blown out of over the years, as you can see in this handy graph :
In 2011, web pages on average were 717 KB. In 2018, websites are huge at 3.5 MB. According to GTmetrix, the average total page size of sites it analyzes is 2.78 MB. There isn’t really any benchmark for the total page size you should be aiming for, but you should try to keep your site as trim as possible.
10. HTTP Requests
I wrote about HTTP requests recently for this blog, so rather than re-invent the wheel I’d encourage you to check out my post, How to Reduce HTTP Requests to Speed Up Your WordPress Site.
It’s worth noting that reducing the total number of HTTP requests your site makes can dramatically increase the speed of your site – a page that is only 100 KB but has 85 HTTP requests is probably worse off than a 200 KB page with only 15 HTTP requests. But do keep in mind that while this is true for HTTP/1, it’s not the case for sites using HTTP/2.
11. Third-Party Domains
While most of your site’s content is hosted on your web server, there’s probably some third-party content site uses, such as embedded video, Gravatars and social media widgets, that is hosted on third-party domains. Because these elements are stored on other domains, you have very limited control over their functionality and the speed at which they load.
The best way to gauge what impact these elements are having on your page speed is to do a waterfall analysis to identify which assets are taking the longest time to load. You might then want to consider whether you really need certain slow-loading assets or want to remove them completely.
Regularly monitoring these website metrics will provide you with the information you need to assess the performance of your website and determine what updates and tweaks you need to make in order to achieve the lightning fast load times that site visitors now expect.
One more user-centric metric that’s worth keeping in mind is perceived performance, i.e. how long a visitor feels like it’s taking for your pages to load. I recommend you read up on this user behavior in addition to making other performance tweaks to speed up your websites.