Sitespeed

Integrate Sitespeed.io with Hosted Graphite to gain insights into how your website or web application performs in different environments and under different conditions.

Sitespeed.io is an open-source tool that runs on Docker and can be used for analyzing website performance helping you identify bottlenecks, and optimize your web pages. Sitespeed has a Graphite output and can be easily configured to send metrics to your Hosted Graphite account.

Send Sitespeed Metrics to Hosted Graphite

You can run the following Docker command against any website URL that you wish to test:

docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:39.5.0 <FULL-URL-OF-SITE-TO-TEST> -n 1 --graphite.host carbon.hostedgraphite.com --graphite.port 2003 --graphite.namespace <YOUR-API-KEY>.sitespeed_io.default.hg

Running this command will send site performance metrics to your Hosted Graphite account and you can easily visualize them by importing various auto-dashboards from the Sitespeed GitHub repository. We also have a Sitespeed Performance dashboard that has been optimized for Hosted Graphite, located in our Dashboard Library. Event data will also be stored locally after each run, so it is recommended to run the command from within a designated directory.

Sitespeed Performance Dashboard

Sending Annotations

To send Sitespeed annotations to Hosted Graphite you must add some required configuration options to your docker run command, such as:

--graphite.webHost www.hostedgraphite.com
--graphite.proxyPath /api/v1/graphite/events/
--graphite.httpPort 443
--graphite.auth <YOUR-API-KEY>:
--graphite.resultBaseURL https://result.sitespeed.io
--graphite.sendAnnotation true

Additionally, you can create a file at the root of your sitespeed directory named config.json to store all of the required --graphite options and run a cleaner command. Here is a template for a config.json file with all of the required Graphite options to include annotations, and a parameter that better aligns the annotations with our default aggregation resolution of 30s:

{
  "graphite": {
    "host": "carbon.hostedgraphite.com",
    "port": 2003,
    "namespace": "<YOUR-API-KEY>.sitespeed_io.default.hg",
    "webHost": "www.hostedgraphite.com",
    "proxyPath": "/api/v1/graphite/events/",
    "httpPort": 443,
    "auth": "<YOUR-API-KEY>:",
    "sendAnnotation": true,
    "annotationRetentionMinutes": ".5" 
    },
   "resultBaseURL": "https://result.sitespeed.io"
}

Save the file then run the Docker command using the --config option:

docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:39.5.0 <URL-of-website-to-test> --config config.json

You can also run Sitespeed tests against multiple URL's by listing them in a separate file and including it in the docker run command:

Create a new file: urls.txt

  https://www.<url-1>.com/
  https://www.<url-2>.com/
  https://www.<url-3>.com/

Save the file and run the Docker command with the new file name in place of the URL:

docker run --rm -v "$(pwd)":/sitespeed.io sitespeedio/sitespeed.io:39.5.0 urls.txt --config config.json

Visualizing Annotations

Default annotations are sent by Sitespeed with tags that will match the following dashboard variables, as defined in the Sitespeed Performance dashboard:

$base $path $group $page $browser $connectivity $testname

These tags can be located in the Go to result annotation rule in the Page Metrics Auto Dash:

Sitespeed Annotations

These default tags allow you to toggle between domains and visualize event annotations that correspond to each URL that Sitespeed was run against. Generally you only need to query the $base $group $page $browser $connectivity variables to see annotations on the Sitespeed Performance dashboard (annotations might not appear as expected with every default variable in place).

Metric Reduction Options

Sitespeed.io generates a large number of metrics by default, which can increase metric usage in Hosted Graphite. If you need to reduce the number of metrics collected, you can disable sets like summary statistics using --browsertime.statistics false, which reduces metrics the forwarded, or use the --metrics.filter option to include only specific groups (e.g: --metrics.filter "*-" --metrics.filter "browsertime.pageSummary.statistics.googleWebVitals.*" to keep only Core Web Vitals).

Keep in mind that filtering metrics may cause some panels in the default Grafana dashboards to stop displaying data, so it’s best used when you only need a subset of performance metrics.