概述在执行长任务时,使用 `isInputPending()` 检测是否存在待处理输入,并主动切片让步,使浏览器更快响应用户操作,降低交互延迟(INP)。示例function heavyWork(items) {
const chunk = 100
let i = 0
(function loop(){
const end = Math.min(i + chunk, items.length)
for (; i < end; i++) process(items[i])
if (i < items.length) {
if (navigator.scheduling?.isInputPending?.()) {
setTimeout(loop, 0) // 让步
} else {
requestIdleCallback(loop, { timeout: 50 })
}
}
})()
}
工程建议切片策略:根据数据量与交互密度动态调整 chunk 与让步方式。与优先级:结合 `scheduler.postTask` 与优先级调度;关键交互优先处理。兼容:特性检测并回退到 idle/animation 帧节奏;记录效果。参考与验证web.dev 任务让步与输入待处理说明:https://web.dev/articles/isinputpendingChrome 平台文档(Scheduler API):https://developer.chrome.com/docs/web-platform/scheduler/

发表评论 取消回复