Performance: measure() 方法

measure(measureName)
measure(measureName, startMark)
measure(measureName, startMark, endMark)
measure(measureName, measureOptions)
measure(measureName, measureOptions, endMark)

如果只指定了measureName，则起始时间戳设置为零，结束时间戳（用于计算持续时间）是 Performance.now() 将返回的值。

您可以使用字符串来识别 PerformanceMark 对象作为起始和结束标记。

要仅提供endMark，需要提供一个空的measureOptions对象：performance.measure("myMeasure", {}, "myEndMarker")。

measureName

表示测量名称的字符串。

measureOptions 可选

一个可能包含测量选项的对象。

detail 可选

要包含在测量中的任意元数据。默认为null。必须是 结构化可克隆的。

start 可选

要用作起始时间的DOMHighResTimeStamp，或用于起始时间的 PerformanceMark 的名称。

如果这是一个命名 PerformanceMark 的字符串，则其定义方式与startMark相同。

duration 可选

起始和结束标记时间之间的持续时间（以毫秒为单位）。如果省略，则默认为 performance.now()；上下文创建后经过的时间。如果提供，则必须同时指定start或end，但不能同时指定两者。

end 可选

要用作结束时间的DOMHighResTimeStamp，或用于结束时间的 PerformanceMark 的名称。

如果这是一个命名 PerformanceMark 的字符串，则其定义方式与endMark相同。

startMark 可选

一个命名性能时间轴中 PerformanceMark 的字符串。此标记的 PerformanceEntry.startTime 属性将用于计算测量值。

endMark 可选

一个命名性能时间轴中 PerformanceMark 的字符串。此标记的 PerformanceEntry.startTime 属性将用于计算测量值。如果要传递此参数，则还必须传递startMark或一个空的measureOptions对象。

创建的 PerformanceMeasure 条目。

返回的测量将具有以下属性值

• entryType - 设置为“measure”。
• name - 设置为“name”参数。
• startTime - 设置为
  • 时间戳，如果在measureOptions.start中指定。
  • 起始标记的时间戳，如果在measureOptions.start或startMark中指定
  • 从measureOptions.end和measureOptions.duration计算出的时间戳（如果未指定measureOptions.start）
  • 0，如果未指定且无法从其他值确定。
• duration - 设置为DOMHighResTimeStamp，它是通过从结束时间戳中减去startTime计算出的测量持续时间。结束时间戳是以下之一
  • 时间戳，如果在measureOptions.end中指定。
  • 结束标记的时间戳，如果在measureOptions.end或endMark中指定
  • 从measureOptions.start和measureOptions.duration计算出的时间戳（如果未指定measureOptions.end）
  • 如果未指定结束标记或无法从其他值确定，则返回 Performance.now() 的值。
• detail - 设置为在measureOptions中传递的值。

TypeError

在任何起始、结束或持续时间可能不明确的情况下都可能引发此错误

• 同时指定了endMark和measureOptions。
• measureOptions指定了duration，但未指定start或end。
• measureOptions同时指定了start、end和duration。

SyntaxError DOMException

命名的标记不存在。

• 使用endMark或measureOptions.end指定了结束标记，但在性能缓冲区中没有名称匹配的 PerformanceMark。

• 使用 endMark 或 measureOptions.end 指定结束标记，但它无法转换为与 PerformanceTiming 接口中只读属性匹配的格式。
• 使用 startMark 或 measureOptions.start 指定开始标记，但在性能缓冲区中没有名称匹配的 PerformanceMark。
• 使用 startMark 或 measureOptions.start 指定开始标记，但它无法转换为与 PerformanceTiming 接口中只读属性匹配的格式。

DataCloneError DOMException

measureOptions.detail 值不为 null，并且无法使用 HTML "StructuredSerialize" 算法进行序列化。

RangeError

measureOptions.detail 值不为 null，并且在使用 HTML "StructuredSerialize" 算法进行序列化期间无法分配内存。

假设您有两个自己的标记 "login-started" 和 "login-finished"，您可以创建一个名为 "login-duration" 的测量，如以下示例所示。然后，返回的 PerformanceMeasure 对象将提供一个 duration 属性来告诉您这两个标记之间经过的时间。

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

要进行更高级的测量，您可以传递 measureOptions 参数。例如，您可以使用来自 click 事件 的 event.timeStamp 属性作为开始时间。

performance.measure("login-click", {
  start: myClickEvent.timeStamp,
  end: myMarker.startTime,
});

您可以使用 details 属性提供任何类型的其他信息。例如，您可能想要记录单击了哪个 HTML 元素。

performance.measure("login-click", {
  detail: { htmlElement: myElement.id },
  start: myClickEvent.timeStamp,
  end: myMarker.startTime,
});