Event Loop

ELI5 — The Vibe Check

JavaScript can only do one thing at a time (single-threaded), but the Event Loop is the trick that makes it seem like it can multitask. It constantly checks: 'Is the call stack empty? Great, let me pull the next task from the queue.' This is how setTimeout, Promises, and fetch callbacks all get their turn without blocking each other.

Real Talk

The Event Loop is the mechanism that allows JavaScript's single-threaded runtime to perform non-blocking operations. It monitors the call stack and the task queues (macro-task queue for setTimeout/setInterval, microtask queue for Promise callbacks). When the call stack is empty, it processes microtasks first, then picks up one macro-task.

Show Me The Code

console.log('1')

setTimeout(() => console.log('2'), 0)

Promise.resolve().then(() => console.log('3'))

console.log('4')

// Output: 1, 4, 3, 2
// Promise (microtask) runs before setTimeout (macro-task)

When You'll Hear This

The Event Loop explains why setTimeout(fn, 0) doesn't run immediately.,Long synchronous tasks block the Event Loop and freeze the UI.,Promises resolve in the microtask queue, before the next macro-task.