2023-04-11 · JavaScript
Understand the JavaScript event loop
Follow one task from the call stack to the microtask queue and finally to the screen.
Introduction
setTimeout(fn, 0) is not zero seconds, and await is not magic. Using diagrams and small experiments, this post shows how tasks, microtasks, and rendering interleave in the browser.
The mental model
- Start from the smallest version that could work, and make it observable.
- Write down the trade-off you are accepting, not only the feature you are shipping.
- Revisit the decision when the team grows; most choices in JavaScript have a shelf life.
A practical starting point
- Reproduce the situation on a scratch branch, next to a measurement you trust.
- Change one variable at a time, and keep the diff small enough to explain in one sentence.
- Keep the result, throw away the scaffolding.
git switch -c experiment/one-thingClosing thoughts
None of this is doctrine. Treat it as a checklist you are allowed to disagree with — ideally with an experiment of your own that settles the argument.