performance.measure()

The measure() method creates a named timestamp in the browser's performance entry buffer between marks, the navigation start time, or the current time. When measuring between two marks, there is a start mark and end mark, respectively. The named timestamp is referred to as a measure.

The measure can be retrieved by one of the Performance interfaces: (getEntries(), getEntriesByName() or getEntriesByType()).

The measure's performance entry will have the following property values:

Note: This feature is available in Web Workers

Syntax

performance.measure(name);
performance.measure(name, startMark);
performance.measure(name, startMark, endMark);
performance.measure(name, undefined, endMark);

Arguments

name
A DOMString representing the name of the measure.
startMark Optional
A DOMString representing the name of the measure's starting mark. May also be the name of a PerformanceTiming property. If it is omitted, then the start time will be the navigation start time.
endMark Optional
A DOMString representing the name of the measure's ending mark. May also be the name of a PerformanceTiming property. If it is omitted, then the current time is used.

Return value

void

Example

The following example shows how measure() is used to create a new measure performance entry in the browser's performance entry buffer.

const markerNameA = "example-marker-a"
const markerNameB = "example-marker-b"

// Run some nested timeouts, and create a PerformanceMark for each.
performance.mark(markerNameA);
setTimeout(function() {
  performance.mark(markerNameB);
  setTimeout(function() {

    // Create a variety of measurements.
    performance.measure("measure a to b", markerNameA, markerNameB);
    performance.measure("measure a to now", markerNameA);
    performance.measure("measure from navigation start to b", undefined, markerNameB);
    performance.measure("measure from navigation start to now");

    // Pull out all of the measurements.
    console.log(performance.getEntriesByType("measure"));

    // Finally, clean up the entries.
    performance.clearMarks();
    performance.clearMeasures();
  }, 1000);
}, 1000);

Specifications

Specification
User Timing Level 2 (User Timing 2)
# dom-performance-measure

Browser compatibility

BCD tables only load in the browser