User Timing API

The User Timing API allows you measure the performance of applications using high-precision timestamps that are part of the browser's performance timeline. There are two types of timing performance entries:

This document provides an overview how to work with the mark and measure performance entry types. For more details and example code, see Using the User Timing API.

Performance marks

Interface: PerformanceMark

PerformanceEntry PerformanceMark

The PerformanceMark interface has the following read-only properties (directly or inherited from PerformanceEntry):

  • detail provides additional information about the mark.
  • duration is always 0 (a mark has no duration).
  • entryType is always "mark".
  • name is the name given when the mark was created.
  • startTime is the timestamp when mark() was called.

Creating performance marks

  • performance.mark() adds a performance mark to the browser's performance timeline.
  • PerformanceMark() constructs a PerformanceMark object that isn't added to the browser's performance timeline.

Retrieving performance marks

Removing performance marks

Performance measures

Interface: PerformanceMeasure

PerformanceEntry PerformanceMeasure

The PerformanceMeasure interface has the following read-only properties (directly or inherited from PerformanceEntry):

  • detail provides additional information about the measure.
  • duration is a DOMHighResTimeStamp that is the duration of the measure (typically, the end mark timestamp minus the start mark timestamp).
  • entryType is always "measure".
  • name is the name given when the measure was created.
  • startTime is the timestamp when measure() was called.

Creating performance measures

Retrieving performance measures

Removing performance measures

Examples

Measuring login duration

Typically, you identify the most critical paths of your application and measure how long it takes from start to finish. For example, you can measure how long it takes to login:

// Place at a location in the code that starts login 
performance.mark("login-started");

// Place at a location in the code that finishes login 
performance.mark("login-finished");

// Measure login duration
const loginMeasure = performance.measure(
  "login-duration",
  "login-started",
  "login-finished"
);

// Send to analytics endpoint
// or log to the console
console.log(loginMeasure.duration);

Specifications

See also