Deconstructing the Event Loop: Microtasks, Macrotasks, and High-Throughput I/O

Deconstructing the Event Loop: Microtasks, Macrotasks, and High-Throughput I/O

Why can a single-threaded runtime like Node.js handle tens of thousands of concurrent network connections without choking? The secret lies in understanding how the V8 JavaScript engine interfaces with the underlying C library libuv through the Event Loop.

At Kone Academy, our Full-Stack Engineering cohort dives into the runtime execution model before touching backend frameworks. Let us deconstruct how execution queues actually operate.

1. The Three Core Memory Arenas

When a JavaScript application executes, execution is divided across three distinct areas:

1. The Call Stack: A single-threaded LIFO (Last In, First Out) stack executing the current instruction frame. If a function blocks here (e.g. infinite loop, sync cryptographic hash), the entire server freezes.
2. The Memory Heap: Unstructured memory allocation for variables, objects, and closures.
3. The Event Loop & Task Queues: The coordination mechanism that pumps queued callbacks back onto the call stack when it becomes empty.

2. Microtasks vs. Macrotasks: Priority Order

Not all asynchronous operations are queued equally. The runtime splits callbacks into two fundamental tiers:

Microtask Queue (Highest Priority)

Microtasks execute immediately after the currently running script finishes and before control is returned to the event loop phases:

• process.nextTick() (Node.js microtask priority queue)
• Promise.then() / catch() / finally()
• queueMicrotask()

Macrotask Phases (libuv Event Loop)

Macrotasks are grouped into distinct lifecycle phases executed in a circle:

1. Timers Phase: setTimeout() and setInterval()
2. Pending Callbacks: I/O errors and OS-level operations
3. Poll Phase: Retrieving new I/O events (HTTP sockets, disk files)
4. Check Phase: setImmediate() callbacks
5. Close Callbacks: Socket closure events (e.g., socket.on('close'))

flowchart TD
    subgraph Stack["Call Stack Execution"]
        Sync["Execute Synchronous Script / Call Stack"]
    end

    subgraph MicrotaskDrain["Microtask Drain (Priority Intercept)"]
        Drain["Drain All Microtasks
(process.nextTick, Promise.then, queueMicrotask)"]
    end

    subgraph LibuvLoop["libuv Event Loop (Macrotask Phases)"]
        P1["Phase 1: Timers
(setTimeout, setInterval)"]
        P2["Phase 2: Pending I/O Callbacks
(System Errors, TCP/UDP)"]
        P3["Phase 3: Idle, Prepare
(Internal libuv housekeeping)"]
        P4["Phase 4: Poll Phase
(epoll_wait, kqueue, IOCP - Blocks for I/O)"]
        P5["Phase 5: Check Phase
(setImmediate callbacks)"]
        P6["Phase 6: Close Callbacks
(socket.on('close'))"]
    end

    Sync --> Drain
    Drain --> P1
    P1 -->|Drain Microtasks| Drain1["Drain Microtask Queue"]
    Drain1 --> P2
    P2 -->|Drain Microtasks| Drain2["Drain Microtask Queue"]
    Drain2 --> P3
    P3 --> P4
    P4 -->|Drain Microtasks| Drain3["Drain Microtask Queue"]
    Drain3 --> P5
    P5 -->|Drain Microtasks| Drain4["Drain Microtask Queue"]
    Drain4 --> P6
    P6 -->|Drain Microtasks| Drain5["Drain Microtask Queue"]
    Drain5 -->|Active Handles Left?| P1

    style Stack fill:#080d1a,stroke:#334155,stroke-width:1px,color:#f8fafc
    style MicrotaskDrain fill:#080d1a,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style LibuvLoop fill:#080d1a,stroke:#334155,stroke-width:1px,color:#f8fafc
    style Sync fill:#0f172a,stroke:#334155,stroke-width:1px,color:#f8fafc
    style Drain fill:#1e293b,stroke:#f59e0b,stroke-width:2px,color:#f8fafc
    style Drain1 fill:#1e293b,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style Drain2 fill:#1e293b,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style Drain3 fill:#1e293b,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style Drain4 fill:#1e293b,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style Drain5 fill:#1e293b,stroke:#f59e0b,stroke-width:1px,color:#f8fafc
    style P1 fill:#0f172a,stroke:#00d4ff,stroke-width:1px,color:#f8fafc
    style P2 fill:#0f172a,stroke:#00d4ff,stroke-width:1px,color:#f8fafc
    style P3 fill:#0f172a,stroke:#334155,stroke-width:1px,color:#f8fafc
    style P4 fill:#0f172a,stroke:#10b981,stroke-width:2px,color:#f8fafc
    style P5 fill:#0f172a,stroke:#00d4ff,stroke-width:1px,color:#f8fafc
    style P6 fill:#0f172a,stroke:#334155,stroke-width:1px,color:#f8fafc

3. The Microtask Starvation Danger

Because the runtime drains the entire microtask queue before proceeding to the next event loop phase, recursively queueing microtasks will completely starve your I/O and timers!

// ANTI-PATTERN: This will lock your server and prevent any HTTP requests from resolving!
function recursiveMicrotask() {
  queueMicrotask(() => {
    recursiveMicrotask();
  });
}
// The call stack empties, but the microtask queue never drains!

Instead, for continuous background processing, offload execution across setImmediate() so the event loop can breathe and process incoming socket connections between cycles:

// PRODUCTION PATTERN: Yield to the poll phase between chunks
function processLargeBatch(items: string[], index = 0) {
  if (index >= items.length) return;

  const chunkSize = 500;
  const chunk = items.slice(index, index + chunkSize);
  for (const item of chunk) {
    transformItem(item);
  }

  // Yield control back to libuv before processing the next chunk
  setImmediate(() => {
    processLargeBatch(items, index + chunkSize);
  });
}

4. Engineering Challenge

Can you predict the exact order of this output before running it?

console.log('1: Sync Start');
setTimeout(() => console.log('2: Timeout Macrotask'), 0);
Promise.resolve().then(() => console.log('3: Promise Microtask'));
process.nextTick(() => console.log('4: NextTick Priority'));
console.log('5: Sync End');

Answer: 1 → 5 → 4 → 3 → 2.

Notice how process.nextTick runs before regular promises, and both finish before setTimeout is allowed onto the stack!

Master high-concurrency Node.js, WebSockets, and system architecture in our Full-Stack Web & Mobile Engineering Track.