Introduction
Speed Analysis Lab automatically collects your custom indicators (you can create your own metrics to fit your specific needs). It can be set up on your pages very easily, thanks to a standard JavaScript interface, supported by all up to date browsers (no external library is required on your site).
Custom Timings are a very simple way to strengthen your performance tracking, by creating specific indicators that will best meet the challenges of your own pages (and without having to install any additional javascript on your pages, since it is a standard API).
Examples of Custom Timings:
- The moment your search input autocomplete is loaded and functional
- On a Product List, the moment users can start to interact with filters
- The moment the loading spinner appears and the moment it disappears to display the final content
- If your interface is made up of separate widgets, the moment the content of each widget is available
How to use Custom timings (User Timing API)
Speed Analysis Lab automatically collects the “marks” and “measures” declared in your web pages by your developers (using the User Timing API). It is important to have a clear naming policy for your marks and measures to make it easier for you to analyze your data.
For your developers, the implementation of a mark is as simple as a single line of code, at the right place of your JS code:
performance.mark("my-custom-timing");
Set up your own custom timings for the most significant elements of your pages and Speed Analysis Lab will immediately start to collect them.
View Custom Timings
You can access custom timings from two places in Speed Analysis Lab.
1. The Waterfall (you can access the Waterfall from your Speed Analysis Lab report)
2. In the displayed metrics in monitors, page groups, scenarios and comparison report.
Select Manage displayed metrics and scroll down to the Custom timings section. Only marks are available to be displayed in the line chart (measures are not).