The Speed Index is a new metric that has been designed to answer one fundamental question: how fast does my web page seem to the visitors ?
Previously the metrics that we had were not relevant enough, they were just milestones timings from the browser perspective. For example, rendered complete will not give us the measurement from the user perspective as this gives us the time until the entire web page has been loaded, even the not visually accessible parts of the application (not visible on the view port).
Today we can use a correlation between the Speed Index, First Paint and First Contentful Paint so that we can have a more objective idea of how the users perceive our web site. A more in-depth explanation of these modern metrics can be found in these blog posts: First Paint, First Contentful Paint, First Meaningful Paint.
Speed Index metric is usually expressed in milliseconds but is not a milestone timing but instead is the result of a calculation that tries to represent in a measurable way the average rendering speed of a web application and the visual progress as seen by the visitors.
Speed Index focuses on what a visitor sees when accessing your web site, it takes into account the above the fold parts of the page (directly visible by the user).
Which are the factors that influence the Speed Index measurement ?
- the view port size, as the measurement takes into consideration the directly visible by the user part of the web site: as the Speed Index is measured for the actual visual part of the screen (above the fold) the size of the view port is influencing the calculation
- also the usual web connection is influencing the measurement: bandwidth, latency
How is the Speed Index calculated ?
The actual Speed Index calculation is done by recording a video of the page loading and decomposing the video into frames.
After this each of the frames is assigned a percentage related to how much of the final rendered page has been already rendered in the frame.
What is a good value for the Speed Index ?
Based on the talks from Google engineer a value of under 1000 is the value that everyone should thrive for.
In reality this is very hard to obtain as is highly dependent on the type of page (home page, landing page, product page).
We, the team from LoadFocus, suggest that the first steps would be to:
- create a first measurement (baseline) for your website and to continue to monitor the evolution against this value
- compare the Speed Index value for your website with the values from your competitors and continuously monitor how your website stands beside the others
In principle the lower the value of the Speed Index the better.