Jake Archibald on the web browser event loop, setTimeout, micro tasks, requestAnimationFrame, ...

Caption notes

Jake Archibald uses the browser’s main thread to explain why asynchronous callbacks differ in when they let the page render. A task has to finish before the browser can return to rendering, but rendering need not happen between every two tasks. Animation-frame callbacks run as part of the rendering steps. At a microtask checkpoint, the browser drains the queue, including microtasks added as it goes, so continually adding microtasks can still keep rendering from resuming.