JavaScript 主线程任务执行顺序表
JavaScript 主线程一帧的完整任务流程
浏览器在每帧（frame）中执行的任务可以分为以下几个阶段：
[同步 JS 执行] → [执行所有微任务] → [检查渲染时机] → [执行宏任务] → [空闲时执行 requestIdleCallback]
1. 同步 JavaScript 任务（主任务）
- 包括你在代码中直接写的函数调用、变量赋值等。
- 这是当前帧最先执行的部分。
2. 微任务队列（Microtask Queue）
- 在同步任务结束后立即执行。
- 包括：
Promise.then,queueMicrotask,MutationObserver,process.nextTick（Node.js 中）等。
3. 浏览器渲染阶段（可选）
-
在微任务之后，浏览器可能会进行：
- 样式计算（Style）
- 布局（Layout / Reflow）
- 绘制（Paint）
- 合成（Composite）
浏览器会根据是否发生了视觉变化决定是否跳过这些步骤。
4. 宏任务队列（Macrotask Queue）
- 包括：
setTimeout,setInterval,requestAnimationFrame,postMessage,DOM 事件，等等。 - 每次事件循环处理一个宏任务。
5. requestIdleCallback 回调（低优先级任务）
- 只有在主线程空闲时才会执行。
- 如果页面繁忙，可能永远不会执行或延迟很久。
