Read first
What it is: the official definition of the browser event loop, in the HTML Living Standard maintained by WHATWG. JavaScript itself (ECMAScript) only defines “jobs”; the browser side, meaning tasks, task queues, the microtask queue and when rendering happens, lives here.
Read: the Event loops section. Start with “Processing model”: it is a numbered list, and it is the source of the “one task, all microtasks, maybe render” rule.
What it settles:
- A browser can have several task queues and choose between them; order is guaranteed only within one queue.
- After each task the microtask checkpoint runs, emptying the microtask queue.
- Rendering (“update the rendering”) is a step of the loop, which is why long tasks delay paint.
Who relies on it: event-loop, task-queue, microtask-queue, web-worker (each worker has its own event loop).