## A Better Way to Measure Website Performance

How do you measure the performance of a website? There is a sizable body of work online on how to optimize websites for Performance, but how do you really know when you've done enough?

Website Performance Optimization is the process that defines the set of tasks that enable your website load faster, use less resources, and generally be a better Internet citizen. However, like all tasks involving technology, it's tough to know when you can pack up your stuff and go home.

When it comes to measuring the performance of websites, there isn't a universally accepted metric. Because of this absence, we usually resort to our own individual interpretations from the data we garner from a variety of tools.

The tools we swear by here at Restive are:

Google Pagespeed Insights is great when you want to see how well your website is doing from a best practice standpoint e.g. "Are my CSS files minified?", "Am I making the most use of Browser Caching?", etc. Unfortunately, Google Pagespeed Insights doesn't showcase any core Web page loading metrics. So, that's when we use WebPageTest; a great tool that provides a flurry of stats that are bound to satisfy even the most ravenous of stat fiends.

Using these two tools together will provide you with all the information you need to know, and to understand, the true state of your website's performance. Still, how is one supposed to make sense of all these numbers? If you've got a Speed Index of 4800 on a Cable Internet connection, is that a good or a bad thing?! If your Web page loads in 22 seconds over mobile 3G Internet connection, is that a good or bad thing?!

When writing the State of the Mobile Web Reports, we had to find a substantive metric to classify websites by performance, because we needed to separate so-called fast websites from slow ones.

As a result, I came up with a metric that we will refer to as the Restive Performance Score.

Here's the formula:

$R_p = P_\alpha + P_\beta$

where:

$P_\alpha$ is the performance score component for optimization and is defined by the following formula:

$P_\alpha = ((ps_1 \times w_1) + (ps_2 \times w_2)) \times \mu_1$

$P_\alpha = ((ps_1 \times w_1) + (ps_2 \times w_2)) \\ \times \mu_1$

$P_\beta$ is the performance score component for speed and is defined by the following formula:

$P_\beta = ((si_1 \times w_1) + (si_2 \times w_2)) \times \mu_2$

$P_\beta = ((si_1 \times w_1) + (si_2 \times w_2)) \\ \times \mu_2$

Here's a quick rundown of all the parameters:

$ps_1$ is the Pagespeed Score for the SPEED Rule Group (Desktop Mode/Strategy)

$ps_2$ is the Pagespeed Score for the SPEED Rule Group (Mobile Mode/Strategy)

$si_1$ is the Speed Index factor for a Desktop User Agent with Cable Internet

$si_1 = \\ (si_d < 2000 \rightarrow si_1 = 100\%) \wedge \\ (si_d > 8000 \rightarrow si_1 = 0\%) \wedge \\ (si_d [2000,8000] \rightarrow si_1 = (\frac{8000 - si_d}{6000}) \times 100\% )$

$si_1 = \\ (si_d < 2000 \rightarrow si_1 = 100\%) \wedge \\ (si_d > 8000 \rightarrow si_1 = 0\%) \wedge \\ (si_d [2000,8000] \rightarrow \\ si_1 = (\frac{8000 - si_d}{6000}) \times 100\% )$

$si_2$ is the Speed Index factor for Mobile User Agent with 3G Internet

$si_2 = \\ (si_m < 3000 \rightarrow si_2 = 100\%) \wedge \\ (si_m > 15000 \rightarrow si_2 = 0\%) \wedge \\ (si_m [3000,15000] \rightarrow si_2 = (\frac{15000 - si_m}{12000}) \times 100\% )$

$si_2 = \\ (si_m < 3000 \rightarrow si_2 = 100\%) \wedge \\ (si_m > 15000 \rightarrow si_2 = 0\%) \wedge \\ (si_m [3000,15000] \rightarrow \\ si_2 = (\frac{15000 - si_m}{12000}) \times 100\% )$

$si_d$ and $si_m$ are the Speed Index values over Cable and Mobile 3G Internet respectively.

The preceding two equations simply define a range of possible outcomes. In the first equation [for $si_1$], if Speed Index is less than 2000, $si_d$ will be 100%; if Speed Index is more than 8000, $si_d$ will be 0%; and if Speed Index is between 2000 and 8000, $si_d$ will be 8000 minus Speed Index divided by 6000 (being the difference between the lower and upper limits). The same applies for the second equation.

$w_1$ is the Weighted-Average Coefficient for desktop traffic, which is 65% (on account that approximately 65% of global Internet traffic [as at the time we came up with the metric] is via desktop). Desktop in this context refers to non-smartphones.

$w_2$ is the Weighted-Average Coefficient for mobile traffic, which is 35% (on account that approximately 35% of global Internet traffic [as at the time we came up with the metric] is via mobile). Mobile in this context refers to smartphones only.

$\mu_1$ is the Weighted-Average Coefficient for performance best-practice compliance (we pegged this at 40% as an indicator of the weight of importance we assign to these performance optimization tasks).

$\mu_2$ is the Weighted-Average Coefficient for performance speed metrics (we pegged this at 60% as an indicator of the weight of importance we assign to core page load metrics).

Note: We'll be updating $w_1$ and $w_2$ periodically to keep pace with current realities. The frequency of the updates are unlikely to be more than once per quarter.

So when we have all the data, we can then calculate the Performance Score, which will never exceed 100%. We can then use an alphabet letter grading system to further qualify the score and determine its Performance Grade. The letters we used were A(90-100), B(80–89), C(70–79), D(60 – 69), and F(59 and below). We can then classify each web page as either Fast or Slow.

A fast website is one with a performance grade of 'A' or 'B'. A slow website is one with a performance grade of 'C', 'D', or 'F'.

At this point, it would make sense to do a simple example. Let's assume that we have a web page that we've tested using both Google Pagespeed Insights and WebPageTest. And, the results give us a Desktop Pagespeed Insights [SPEED] Score of 91, a Mobile Pagespeed Insights [SPEED] Score of 86, a Speed Index (Cable Internet + Desktop user agent) of 3000, and a Speed Index (3G Internet + Mobile user agent) of 5000.

Using our formula, the Performance Score of the web page will be 85.7, and its Performance Grade will be 'B'. This means that the Web page is fast.

Scoring website performance this way is not 100% definitive, but it does give you a much better idea of the real performance characteristics of your Web page, especially since it incorporates and prioritizes Speed Index.

We feel comfortable standardizing on this score for measuring website performance. Still, we'd love to hear what you think. Please let us know in the comments.

Also, we've built a simple online calculator that you can use to check your Restive Performance Score. It's still pretty rudimentary, but we have plans to make it fully automated. Give it a go!

Category: tips and tricks    Tags: ideas, performance, web design