PerformanceElementTiming: loadTime 属性

实验性: 这是 实验性技术
在生产环境中使用之前,请仔细查看 浏览器兼容性表

loadTimePerformanceElementTiming 接口的只读属性,它始终为文本返回 0。对于图像,它返回一个时间,该时间是图像资源加载时间和图像资源附加到元素的时间之间的较晚者。

表示元素 loadTimeDOMHighResTimeStamp。对于文本始终为 0

示例

记录 loadTime

在此示例中,一个 <img> 元素通过添加 elementtiming 属性来进行观察。一个 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 });

规范

规范
元素计时 API
# ref-for-dom-performanceelementtiming-loadtime①

浏览器兼容性

BCD 表只在启用 JavaScript 的浏览器中加载。