线上页面偶尔卡一下，怎么监控长任务和卡顿并上报？

浏览器已经提供了现成的观测接口，不用自己写死循环去测。用 PerformanceObserver 订阅 longtask，主线程上超过 50ms 的任务都会被记录下来；Chrome 123 起还有 long-animation-frame，能告诉你是哪个脚本拖慢了这一帧。交互卡顿直接用 web-vitals 库采 INP。采到之后按页面聚合、抽样，页面隐藏时用 sendBeacon 发出去。

速记要点

• 长任务：主线程上超过 50ms 的任务
• longtask 只告诉你卡了，不告诉你是谁
• long-animation-frame 能定位到具体脚本
• 交互卡顿看 INP，用 web-vita