Which are the main site speed metrics and how to use them to increase website performance?

This post has the aim of explaining which are the key site speed metrics and how you can use them to speed up your website.

Page Load time

As we have seen in a previous post, page load time indicates the time needed to download and view the whole content of a web page in the browser window. Page load time has calculated from the beginning, when a user clicks on a link or types a web address, to the end, when the page is fully loaded on the screen. Page load can have different values according to the type of browser used and user’s geographic location. To fix it, you can adopt Content Delivery Network solutions, designed specifically to distribute contents all over the world speeding up your site ad keeping top performance.

Time to First Byte (TTFB)

We have also seen that Time to First Byte (TTFB) is the metric that can be used to measure server speed. It’s calculated by counting the time from when a user requests a site until its browser receive the first web page byte. TTFB is not perceived by users, but it’s so relevant as site speed parameter. When calculating, you need to consider the use of CMS platform (WordPress, Magento or others). In that case TTFB can be easily reduced implementing proper plugins. If you still get poor TTFB, you might need to check the quality of your hosting provider service.

Document Load

Document Load, or Document Complete, refers to a series of “events” viewed by the user. Usually Doc Load indicates when all texts, images and other HTML elements are fully loaded, but it could not include some contents triggered by JavaScript (for instance, animations or forms).

Page Complete

After Document Complete, just some JavaScript files are left to complete the loading. Once they are fully loaded, we get Page Complete. When the browser stops to receive information or requests for 2 seconds, that means that the Page is entirely loaded. It is an important value but it can be different from test to test, so it’s better to use it in conjunction with other site speed metrics to get a true picture.

Speed Index

Speed Index estimates the average time needed to load visible parts of a web page in the browser window. It’s the score that your website gets from a collection of speed metrics. Lower the Speed Index score, faster your website is performing. Heavy contents “above the fold” (on top of the page) can give negative Speed index, on the contrary “below the fold” contents are not included in the calculation. Speed Index is very useful to make comparisons, for instance to check if optimizations made are working or to compare your website with competitors. However, it doesn’t show the specific areas which need to be improved, so use it with other site speed metrics to understand better the situation. Speed Index can be improved by optimizing fonts, images (therefore reducing page sizes which we’ll cover shortly) and by lazy-loading images.

Time to Interactive

Time to Interactive (TTI) is the time that it takes for a web page to become interactive. “Interactive” means that all the visible elements are loaded and the page respond immediately to user interaction. TTI is a crucial metric to measure initial user experience. Many websites load quickly but get a few seconds more before you can properly use them. That is a frustrating experience for customers and it often leads them to abandon the site. A great method to improve TTI is to defer unnecessary JavaScript.

Number of Resources

Anytime a user requests a website, it sends a series of HTTP(S) requests for all the files which make up the page. All the HTTP requests together constitute large part of the site speed. You can analyze any request that your website makes (when it loads, request size, how long it takes to complete). It’s a very useful tool because allows you to pinpoint possible issues and solve them rapidly. An effective way to reduce the amount of HTTP requests is to combine CSS and JavaScript files.

Page Size

Page Size refers to the weight (in KB or MB) of all files in the website. If the site includes many heavy files, Page Size might be high and slowdown the website. Image are the major factor of large Page Size. Different solutions can be used to lower it: minimize CSS, HTML and JavaScript files, optimize images and use methods of compression such as gzip. In addition, for website using CMS there are many plugins available to reduce large Page Size.

Each site speed metric matters!

When you use a tool to test site speed, be aware of the kind of metric they’re reporting on. Often popular tools get only TTFB, which is very important but it doesn’t provide the overall picture. Thereby you need to be careful of what are you testing and how. Once you get those information, you will be able to proceed with the optimization of your website to make it as faster as possible. Just remember that there’s not only one number you must focus on, but each site speed metric matters. Maybe start from reducing file size and HTTP(S) requests, indirectly lowering some of the key metrics related to site speed. From there you can identify specific issues and improve site speed further.