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 using any of the Performance
interfaces: (getEntries()
, getEntriesByName()
or getEntriesByType()
).
measure(measureName)
measure(measureName, MeasureOptions)
measure(measureName, startMark)
measure(measureName, startMark, endMark)
If only measureName
is specified, the start timestamp is set to zero, and the end timestamp (which is used to calculate the duration) is the value that would be returned by Performance.now()
.
The PerformanceMeasure
entry that was created.
The returned measure will have the following property values:
-
entryType
- set to "measure
".
-
name
- set to the "name
" argument.
-
startTime
- set to:
- a
timestamp
, if specified in MeasureOptions.start
.
- the
timestamp
of a start mark, if specified in MeasureOptions.start
or startMark
- a timestamp calculated from the
MeasureOptions.end
and MeasureOptions.duration
(if MeasureOptions.start
was not specified)
- 0, if it isn't specified and can't be determined from other values.
-
duration
- set to a DOMHighResTimeStamp
that is the duration of the measure calculated by subtracting the startTime
from the end timestamp. The end timestamp is one of:
- a
timestamp
, if specified in MeasureOptions.end
.
- the
timestamp
of an end mark, if one is specified in MeasureOptions.end
or endMark
- a timestamp calculated from the
MeasureOptions.start
and MeasureOptions.duration
(if MeasureOptions.end
was not specified)
- the value returned by
Performance.now()
, if no end mark is specified or can be determined from other values.
-
detail
- set to the value passed in MeasureOptions
.
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"
performance.mark(markerNameA);
setTimeout(function() {
performance.mark(markerNameB);
setTimeout(function() {
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");
console.log(performance.getEntriesByType("measure"));
performance.clearMarks();
performance.clearMeasures();
}, 1000);
}, 1000);