PerformanceEntry: duration プロパティ
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.
値
DOMHighResTimeStamp
で、パフォーマンス項目の継続時間を表します。具体的なパフォーマンス指標に長さの概念が適用されない場合は、0
の時間を返します。
このプロパティの意味は、このパフォーマンス項目の entryType
の値によって異なります。
event
-
イベントの
startTime
から次のレンダリングペイントまでの時間です(8 ミリ秒単位に丸めた値)。 first-input
-
最初の入力イベントの
startTime
から次のレンダリングペイントまでの時間です(8 ミリ秒単位に丸めた値)。 longtask
-
タスクの開始から終わりまでの経過時間です(1 ミリ秒単位)。
measure
-
測定の時間です。
-
この項目の
loadEventEnd
プロパティとstartTime
プロパティの差です。 resource
-
この項目の
responseEnd
値からこの項目のstartTime
値を引いたものです。
以下の種類の項目では duration
は適用されず、この場合の値は常に 0
になります。
element
largest-contentful-paint
layout-shift
mark
paint
taskattribution
visibility-state
例
duration プロパティの使用
次の例では、duration
が 0
より大きいパフォーマンス項目をすべてログ出力します。
js
function perfObserver(list, observer) {
list.getEntries().forEach((entry) => {
if (entry.duration > 0) {
console.log(`${entry.name}'s duration: ${entry.duration}`);
}
});
}
const observer = new PerformanceObserver(perfObserver);
observer.observe({ entryTypes: ["measure", "mark", "resource"] });
仕様書
Specification |
---|
Performance Timeline # dom-performanceentry-duration |
ブラウザーの互換性
BCD tables only load in the browser