事件不再缓冲并延迟到其对应的

交互到下一次绘制 (INP)
成为官方的核心 Web 生命力指标
截至 2024 年 3 月 12 日,INP 已正式取代 FID 成为核心 Web 生命力评估中的新响应能力指标。

 

由于 FID 的测量范围和有效性,这种交换是必要的。虽然 FID 衡量的是第一次互动的响应性,但 INP 会评估用户整个会话中的

所有互动,因此它是一种更全面的指标。

默认启用 EventTimingKeypressAndCompositionInteractionId
按键输入在事件计时中被 教师数据库 配一个interactionID。在组  合过程中(使用 IME 或虚拟键盘),interactionID还会暴露给 keydown 和 keyup 事件,而不像以前那样只暴露给输入事件。

 

教师数据库

Keydown  keyup 事件;相反,keydown 事件的 interactionID 会预先生成。此实验首次在 Chrome 123 中引入。

虽然这一变化不会显著影响键  四种类型的克隆 盘交互的用户体验,但它可能会导致测量结果发生变化,因为 INP 现在还会测量按键次数。不过,由于 INP 关注的是较慢、高百分位的交互持续时间,而键盘交互通常很快,因此整个网站的 INP 通常不会受到影响。

事件计时刷新 contextmenu 上的 pointerdown 和 keydown
当右键单击或键盘菜单键调出上下文菜单时,性能事件计时最初不会报告pointerdown或keydown条目。

发生这种情况的原因是这些条目保存在 AGB目录 缓冲区中并延迟到pointercancel、pointerup或keyup事件。

但是,如果pointerdown后面只有contextmenu而没有后续事件,则条目会卡在缓冲区中。通过添加一个计时器,在contextmenu激活时刷新所有pointerdown、pointerup和 keydown 条目并将其视为交互,解决了此问题。如果 pointerdown 和 pointerup 在一秒钟内相继出现,则计时器可确保具有相同interactionId的 pointerdown 和 pointerup 匹配。

 

虽然 INP 时长值保持不变,但由于包含上下文菜单交互,总测量交互量将略有增加。这对网站的 INP 的影响微乎其微,因为上下文菜单交互通常很快,不会影响高百分位 INP 分数。

我如何跟踪所有最新的 Core Web Vitals 更新?

访问官方Core Web Vitals 变更日志目录。

14 项可添加到您的核心 Web 生命力战略中的优化
如何改善最大内容绘制
众所周知, LCP很难优化,因为需要考虑很多变化因素。这就是为什么截至 2024 年 5 月,只有62.1%的来源通过了该测试。

 

然而,困难并不代表不可能。

除了实施所有众所周知的LCP 优化技术之外,您还应该考虑实施以下部分(如果不是全部)策略:

1. 使用fetchpriority

当浏览器解析网页并开始发现和下载图像、脚本或 CSS 等资源时,它会为这些资源分配优先级,以便按照最佳顺序下载它们。

通过Fetch Priority API 和fetchpriority HTML 属性,您可以提示资源的相对优先级——高、中或低。

话虽如此,通过应用“ fetchpriority=high”来提高 LCP 图像的优先级可以使 LCP 元素更快地加载。

滚动至顶部