Appendix A: Event-loop task-ordering cheat sheet

Per event loop turn:
1. Execute ONE task from the macrotask queue (a whole <script>, a setTimeout
   callback, a UI event handler, an I/O completion)
2. Drain the ENTIRE microtask queue (Promise .then/.catch/.finally callbacks,
   queueMicrotask, async/await resumptions) — including any NEW microtasks
   queued by microtasks that just ran
3. If it's time for a frame: run requestAnimationFrame callbacks, then
   style/layout/paint (Part III)
4. Repeat from step 1

Ordering priority, highest to lowest:
  synchronous code  >  microtasks (Promises)  >  requestAnimationFrame  >
  macrotasks (setTimeout, I/O, most events)  >  requestIdleCallback