JS 执行规则

[CPPAlien]

宏任务(Macrotask, Event queue)

Macrotasks includes parsing HTML, generating DOM, executing main thread JS code and other events such as page loading, input, network events, timer events, etc. From the browser’s point of view, Macrotask represents some discrete and independent work.

setTimeout,setInterval,setImmediate,requestAnimationFrame,I/O,UI rendering

微任务 (Microtask, Job queue)

Microtasks is to complete some minor tasks to update the application state, such as processing the callback of Promise and DOM modification, so that these tasks can be executed before the browser re-renders. Microtask should be executed asynchronously as soon as possible, so their cost is less than Macrotask, and it can make us execute before UI rendering again, avoiding unnecessary UI rendering.

process.nextTick,Promises,Object.observe,MutationObserver

[CPPAlien]

https://ddcode.net/2019/06/20/analysis-of-microtask-and-macrotask-in-js-event-cycle/

[CPPAlien]

https://savokiss.com/tech/event-loop.html

[CPPAlien]

The ECMAscript 2015 (ES6) specification requires tasks to run Promise reaction callbacks to form their own job queue called "PromiseJobs". ECMAscript and HTML specifications do not use the same language, so let's notionally equate ECMA's "Promise Job queue" with HTML task queue "B" in the browser - at least a different queue to the one used by timers. https://stackoverflow.com/questions/40880416/what-is-the-difference-between-event-loop-queue-and-job-queue