Skip to main content
← JavaScript Lesson 4 / 5

The Event Loop

JavaScript can only do one thing at a time — it has a single call stack. So how does it juggle timers and network without freezing? It uses queues and an event loop. Press Tick and watch the rule: run all the normal code, then empty the microtask queue (promises), then take one task from the macrotask queue (timers), and repeat.

Pick a program

Source

  1. console.log("A");
  3. setTimeout(() => {
  4. console.log("B");
  5. }, 0);
  7. Promise.resolve().then(() => {
  8. console.log("C");
  9. });
  11. console.log("D");

move 0 · Ready. Press Tick to run the first line of the script.

The loop in one line: drain the stack, flush ALL microtasks, take ONE macrotask, repeat.

Call Stack

LIFO · newest on top
empty

Web APIs / Timers

setTimeout waits here
empty

Macrotask Queue

FIFO · timers land here
empty

Microtask Queue

FIFO · promises land here
empty

Console

the printed output
no output yet