## 什么是INP指标 ### 指标说明与下一次绘制的交互INP（Interaction to Next Paint）会在页面生命周期内观察用户与网页进行的所有点击、点按和键盘互动的延迟时间，并报告最长持续时间。INP 较低意味着页面始终能够快速响应大多数用户互动。 ### 指标基准线为确保提供良好的响应速度的用户体验，建议衡量的是实际记录的网页加载的**第 75 个百分位**： * INP 等于或小于 **200 毫秒**表示您的网页**具有良好的响应速度**。 * 如果 INP 介于 **200 毫秒**到 **500 毫秒**之间，则意味着您网页的响应能力**需要改进**。 * INP 大于 **500 毫秒**表示网页**响应速度慢**。 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/a61c410a35fa4d65bccc2cd441619891~tplv-goo7wpa0wc-image.image =800x) ## 如何计算INP指标 INP 的计算方法是观察用户与网页进行的所有互动。对于大多数网站，系统会以 INP 的形式报告延迟时间最长的互动。但是，对于具有大量互动的网页，随机的小故障可能会导致在其他响应网站上出现异常高的延迟互动。互动越多，发生这种情况的可能性就越大。为了解决此问题，并更好地衡量这些类型网页的实际响应速度，我们忽略了每 50 次互动带来的 1 次最高互动。由于绝大多数网页体验都不会超过 50 次互动，因此浏览器几乎总是报告最差的互动。然后，系统会照常报告所有网页浏览量的第 75 百分位，这会进一步移除离群值，使之更具代表性的用户体验。互动是指在同一逻辑用户手势期间触发的一组事件处理脚本。例如，触摸屏设备上的“点按”互动包括多个事件，如 `pointerup`、`pointerdown` 和 `click`。互动可由 JavaScript、CSS、表单元素等内置浏览器控件或这些元素的组合促成。互动的延迟时间包括从用户开始互动到下一帧显示视觉反馈的那一刻，驱动互动的一组事件处理脚本的最长时长。如需详细了解如何衡量 INP，请参阅[“什么是互动？”](https://web.dev/articles/inp?hl=zh-cn#whats_in_an_interaction)。 ## 平台如何应用INP指标 ### PID聚合 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/943296a5f3df4ede9cc28cd0ee67b10c~tplv-goo7wpa0wc-image.image =800x) ### 指标总览 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/b5a33e2b7a464495b8301929ae65b807~tplv-goo7wpa0wc-image.image =800x) ### 页面列表 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/c2969e50bcfe4c85b08a162ca78f8b7a~tplv-goo7wpa0wc-image.image =800x) ### 数据探索 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/f6a0d1f8b90246f29f564b28206d7008~tplv-goo7wpa0wc-image.image =800x) ### 自定义看板 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/3585ba0dd8d344239143f9784c2cff84~tplv-goo7wpa0wc-image.image =800x) ### 监控报警 ![图片](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/4eef634979a94b0ba62137c0cdaa54a2~tplv-goo7wpa0wc-image.image =800x) ## 参考资料 https://web.dev/articles/inp

应用性能监控全链路版