Track function execution
setTimeout, setInterval, I/O
Promises, queueMicrotask
See the exact sequence
Click "Visualize Execution" to see how JavaScript processes this code.
console.log('1');
setTimeout(() => console.log('2'), 0);
Promise.resolve().then(() => console.log('3'));
console.log('4');
// Output: 1, 4, 3, 2
Even with delay 0, setTimeout is a macro task and waits for the call stack AND micro tasks to clear.
// This will NOT print immediately
setTimeout(() => console.log('Not first!'), 0);
console.log('First!');
// Output: First!, Not first!
Promises use the micro task queue, which always gets processed completely before the next macro task (like setTimeout). This ensures Promises resolve as quickly as possible.
The event loop will continue processing micro tasks until the queue is empty. This means recursive micro tasks can block macro tasks from running - be careful of infinite micro task loops!
requestAnimationFrame is neither - it runs as a separate "render" phase in the event loop, after micro tasks but scheduled to sync with the browser's display refresh rate (typically 60fps).