点了没反应，等半天页面才响应，这个体验比加载慢还让人烦躁。INP 就是衡量这个的指标。
INP 超标，原因基本都出在 JavaScript 上。用户点一下，浏览器要执行一堆脚本，主线程被占住了，没法及时响应用户的操作。等脚本跑完了，页面才动。这个延迟，用户是能明显感觉到的。
那什么脚本会拖累 INP。第一，页面加载时就开始跑的耗时任务。比如一个复杂的计算，或者处理一大堆数据。这种任务要把主线程占住好几百毫秒。第二，事件处理函数里的重活。用户点了按钮，触发的函数里做了大量计算或者 DOM 操作。第三，第三方脚本。统计、广告、客服插件这些，你不知道它们在干什么，有时候会突然占住主线程。第四，频繁的 DOM 操作。一次改一点，改很多次，浏览器要反复重排重绘。
那怎么优化。第一，把长任务拆开。一个耗时五百毫秒的任务，拆成几个小任务，中间让出主线程，这样用户的操作能插进去。第二，事件处理函数里别做重活。用户点了先给个视觉反馈，真正的计算放到后面异步做。第三，减少第三方脚本。这个前面讲过，能砍就砍。第四，批量做 DOM 操作。别一次改一个，攒一批一起改。
还有个小技巧，就是给用户及时的视觉反馈。用户点了按钮，哪怕真正的处理还没完成，先让按钮变个颜色或者显示个加载状态。用户看到有反应了，就不会觉得卡。
优化 INP 需要对代码有了解，如果你不是做开发的，可以把这个问题反馈给技术，让他们用性能分析工具跑一下，找出耗时的函数。找到就好办了。
—— 来自 图趣网 - 优秀网站分类目录 的分享
