← back to flaviocopes.com

Event loop visualizer

← All tools

Step through preset JavaScript snippets and watch the call stack, microtask queue, macrotask queue, and console output change.

~~~

Presets

Code

~~~

Call stack

(empty)

Microtask queue

(empty)

Macrotask queue

(empty)

Console output

(no output yet)

Precomputed steps for teaching — not a live JS interpreter. Real engines may differ in edge cases, but the queue ordering shown here matches V8/Node behavior for these patterns.

~~~

About this tool

JavaScript looks single-threaded, but timers and promises schedule work for later. The event loop drains the call stack, then runs all microtasks (promises, queueMicrotask), then one macrotask (setTimeout, I/O), and repeats.

That is why Promise.then beats setTimeout(fn, 0)and why async/await can pause a function without blocking the main thread. Step through each preset to build the mental model.

~~~

Read more