BOOMR.plugins. UserTiming

The UserTiming plugin to collect metrics from the W3C UserTiming API.

This plugin can make use of the UserTimingCompression library. In order to use compression, UserTimingCompression must be loaded before this plugin's init() is called.

This plugin collects all marks and measures that were added since navigation start or since the last beacon fired for the current navigation.

For information on how to include this plugin, see the Building tutorial.

Beacon Parameters

This plugin adds the following parameters to the beacon:

• usertiming: UserTiming data

The value is either plain json or a compressed string using UserTimingCompression library. A decompression function is also available in the library.

Timing data is rounded to the nearest millisecond.

Example

// mark current timestamp as mark1
performance.mark('mark1');
// mark current timestamp as mark2
performance.mark('mark2');
// measure1 will be the delta between mark1 and mark2 timestamps
performance.measure('measure1', 'mark1', 'mark2');
//measure2 will be the delta between the mark2 timestamp and the current time
performance.measure('measure2', 'mark2');

When not using compression, data added to the beacon will look similar to the following:

usertiming={"mark":{"mark1":100,"mark2":200},"measure":{"measure1":100,"measure2":200}}

When using compression, data added to the beacon will look similar to the following:

usertiming=~(m~(ark~(1~'2s~2~'5k)~easure~(1~'2s_2s~2~'5k_5k)))

Decompressing the above value will give us the original data for the marks and measures collected:

[{"name":"mark1","startTime":100,"duration":0,"entryType":"mark"},
{"name":"measure1","startTime":100,"duration":100,"entryType":"measure"},
{"name":"mark2","startTime":200,"duration":0,"entryType":"mark"},
{"name":"measure2","startTime":200,"duration":200,"entryType":"measure"}]

Uncompressed measures only send their duration in contrast to compressed measures, which also send their startTime.

Compatibility

Many browsers support the UserTiming API, e.g.:

• Chrome 25+
• Edge
• Firefox 38+
• IE 10+
• Opera 15+

See Nic Jansma's usertiming.js polyfill library to add UserTiming API support for browsers that don't implement it natively.