布局偏移：hadRecentInput 属性

实验性： 这是一项实验性技术
在生产环境中使用此功能之前，请仔细查看浏览器兼容性表。

hadRecentInput 是 LayoutShift 接口的只读属性，如果 lastInputTime 在过去 500 毫秒内，则返回 true。

布局偏移只有在用户没有预料到它们的情况下才会成为问题，因此由用户交互导致的布局偏移（例如用户扩展 UI 元素）通常不会被计入布局偏移指标。hadRecentInput 属性允许您排除这些偏移。

值

如果 lastInputTime 在过去 500 毫秒内，则返回一个布尔值 true；否则返回 false。

示例

忽略最近的用户输入，以便获得布局偏移得分

以下示例展示了如何使用 hadRecentInput 属性仅统计没有最近用户输入的布局偏移。

const observer = new PerformanceObserver((list) => {
  for (const entry of list.getEntries()) {
    // Count layout shifts without recent user input only
    if (!entry.hadRecentInput) {
      console.log("LayoutShift value:", entry.value);
      if (entry.sources) {
        for (const { node, currentRect, previousRect } of entry.sources)
          console.log("LayoutShift source:", node, {
            currentRect,
            previousRect,
          });
      }
    }
  }
});

observer.observe({ type: "layout-shift", buffered: true });

规范

规范
布局不稳定 # dom-layoutshift-hadrecentinput

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅

LayoutShift.lastInputTime