Measuring Page Load Times for Humble Sites with Google Analytics

I like fast sites. I also like to keep track of how changes to my code affect the page load time.

There are many tools to record page load times - Node.js based tools for running in your own environment, and third-party services to give an external view of site performance. Both of which are more diagnostic in nature than useful for reporting.

I'm more interested in what my users are experiencing. For example, I like to know how switching to a static site changed page load time for my users. Enter Google Analytics.

Google Analytics records page load times.  However, the default sample rate for this metric is 1%, meaning only 1% of your users are being tracked for page speed.  If you have a small amount of traffic to your site, 1% is not going to give you meaningful data.

Here is how you can change that:

If you are using the newer Analytics.js tracking script from Google Analytics, and haven't modified it in any way, you probably have something like this:

ga("create", "UA-xxx-1", "domainname.com");
ga("send", "pageview");

Diving into the Google Analytics Field Reference, I found the section on the Site Speed Sample Rate, which is accessed by passing a third argument to the ga() create call. However, I was already passing the domain name as the third argument, and didn't want to remove that parameter. I needed to dig a little deeper.

Next, I found the documentation for the ga() create method. I see that the third argument is the cookieDomain, and can also be used in object format. By changing to the object format, I can leave the cookieDomain as it is, and add the siteSpeedSampleRate, which is exactly what I want. Here's the final script:

ga("create", "UA-xxx-1", {
  cookieDomain: "domainname.com",
  siteSpeedSampleRate: 100,
});
ga("send", "pageview");

That's it! Now I can gather a meaningful amount of data, and monitor the performance of my site in the real world.