PerformanceElementTiming: loadTime 屬性

可用性有限

此特性不是基線特性,因為它在一些最廣泛使用的瀏覽器中不起作用。

實驗性: 這是一項實驗性技術
在生產中使用此技術之前,請仔細檢查瀏覽器相容性表格

PerformanceElementTiming 介面的只讀屬性 loadTime 對於文字始終返回 0。對於圖片,它返回的是圖片資源載入時間和其附加到元素上的時間之間的最新時間。

一個 DOMHighResTimeStamp,表示元素的 loadTime。對於文字始終為 0

示例

記錄 loadTime

在此示例中,透過新增 elementtiming 屬性來觀察一個 <img> 元素。註冊一個 PerformanceObserver 來獲取型別為 "element" 的所有效能條目。使用 buffered 標誌來訪問建立觀察者之前的資料。呼叫 entry.loadTime 可以返回圖片元素的 loadTime。

html
<img
  src="image.jpg"
  alt="a nice image"
  elementtiming="big-image"
  id="myImage" />
js
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    if (entry.identifier === "big-image") {
      console.log(entry.loadTime);
    }
  });
});
observer.observe({ type: "element", buffered: true });

規範

規範
Element Timing API
# dom-performanceelementtiming-loadtime

瀏覽器相容性