requestIdleCallback 是浏览器在主线程空闲时以低优先级执行回调的 API，不脱离主线程，适合渐进式轻量任务；需检测支持性、用 deadline.timeRemaining() 控制执行时长、避免无限递归。
requestIdleCallback 是什么，它真能“后台执行”吗
requestIdleCallback 不是 Web Worker，也不脱离主线程——它只是在浏览器判断主线程“空闲”（即无高优先级任务如渲染、用户输入响应）时，把回调塞进一个低优先级的微任务队列。它不创建新线程，也不能绕过 JS 单线程限制。所以别指望它处理耗时 100ms 以上的计算而不卡 UI；它的设计目标是：做一点、让一下、再做一点。
- 它适合做非紧急的渐进式工作：比如懒加载非首屏图片的 DOM 更新、分析埋点数据批量上报、轻量级状态预计算
- 浏览器可能直接忽略回调（比如页面切到后台、设备节电模式开启、或空闲时间不足）
- 没有超时机制，除非你手动加
timeout参数
怎么安全调用 requestIdleCallback 并防止无限递归
直接写 requestIdleCallback(callback) 很容易漏掉两个关键点：没检查浏览器支持、没处理回调中再次调度自身时的边界条件。
- 必须先检测支持性：
if ('requestIdleCallback' in window)，否则降级为setTimeout(callback, 0)或直接同步执行（视任务紧急程度而定） - 回调函数必须接收
deadline参数，并用deadline.timeRemaining() > 0判断是否还能继续执行，否则会吃光剩余空闲时间，导致后续帧卡顿 - 若需循环执行（如分片处理数组），应在每次回调末尾重新调用
requestIdleCallback，但要加终止条件（如处理完全部数据、或主动 break）
timeout
- 设为
{ timeout: 2000 }后，回调可能在第 1999ms 被调用（如果主线程一直忙），也可能在第 50ms 就被调用（如果立刻空闲） - 如果主线程持续忙碌（比如长按滚动、动画密集），
timeout到期后回调仍可能被延迟，直到下一个空闲窗口出现 - 不要依赖
timeout做时效性要求高的逻辑（如防抖取消、倒计时更新），那该用setTimeout或requestAnimationFrame
和 setTimeout(0)、Promise.then 的实际区别在哪
三者都“异步”，但调度时机和优先级不同：
-
setTimeout(fn, 0)进宏任务队列，至少等完当前任务 + 当前轮次所有微任务，且不受浏览器空闲状态影响 -
Promise.then(fn)进微任务队列，紧接当前同步代码之后执行，无法让出主线程给渲染 -
requestIdleCallback(fn)是浏览器控制的“空闲感知”宏任务，会主动避开渲染帧、输入响应等关键窗口，适合真正想“不打扰用户”的场景
实际项目中，如果你的任务可中断、无实时性要求、且希望对用户操作零干扰，requestIdleCallback 是更精细的选择；否则，老老实实用 setTimeout 更可控。
真正容易被忽略的是：它没有 polyfill —— 不能靠加载一段 JS 来补全行为，不支持就是不支持。而且在 iOS Safari 16.4 之前，它默认被禁用（需手动开启实验性功能），所以生产环境务必做好降级路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
