记录一下那天晚上的排查过程。移动端 INP 显示 320 毫秒,用户点导航要等半秒才有反应。页面加载并不慢,问题集中在点击之后的处理逻辑上。

原因不止一个,得分开看。点击事件里同步执行了统计上报请求。少数情况下是第三方脚本在主线程上做了大量计算。

还有一种情况,事件监听没有做防抖,一次点击触发多次。

先统计首屏脚本的数量

curl -s https://www.example.com/ | grep -o '<script' | wc -l

然后把统计请求改成空闲时发送

requestIdleCallback(() => send(evt));

等前面都确认过,再确认首屏第三方域名的数量

curl -s https://www.example.com/ | grep -c 'https://'

这台环境是别人交接的,不少默认值被动过,只能一项项核。

改完先别撤,确认这几项。点击后的响应时间降到 200 毫秒以内,交互不再有明显卡顿。

这里还有个坑。INP 取的是最差的一次交互,平均值好看不代表没问题,排查时要看第九十五百分位而不是平均数。线上能稳定复现的问题都不算难,难的是只在大流量下才出现的那种。

作者 9823189