Jake Archibald: “In The Loop” — Taking a close look into the browser’s Event Loop

Talk by Jake Archibald, as brought at JSConf.Asia 2018, taking a close look into the browser’s Event Loop:

This talk looks at the browser’s event loop, the thing that orchestrates the main thread of the browser, which includes JavaScript, events, and rendering. We’ll look at the difference between tasks, microtasks, requestAnimationFrame, requestIdleCallback, and where events land.
Hopefully you’ll never have to use setTimeout hacks again!”

And yeah, I’ve also used getComputedStyle() in the middle of some JS code before, in order to force layout/re-rendering 😬

~

Additionally you might also want to read How JavaScript works: Event loop and the rise of Async programming by Alexander Zlatkov, which also has a nice visualisation of what’s going on.

Once saw an interactie version of the visuals as shown in Alexander Zlatkov’s post. I think it was in a talk, yet can’t seem to find it back anywhere … if someone could point me to it, feel free to comment 😉