What is the difference between microtasks and macrotasks in the JavaScript event loop?

Question

JavaScript Developer — Hard

What is the difference between microtasks and macrotasks in the JavaScript event loop?

Accepted Answer

Microtasks (Promises, queueMicrotask, MutationObserver) execute after the current task and before the next macrotask, draining the entire microtask queue first. Macrotasks (setTimeout, setInterval, I/O) execute one per event loop iteration.