What the heck is the event loop anyway? | Philip Roberts | JSConf EU
JSConf16 HN recommenders · recommended in 14 months, 2015-2025
3.8M views · 12 years ago · talk · evergreen
Philip Roberts explains the JavaScript event loop, call stack, callbacks and asynchronous behavior with live visualizations using a tool he built. It demystifies terms like non-blocking and single-threaded.
HN commenters repeatedly name it as the best explanation of the JS event loop and the first thing to watch before tackling async code.
35:12Jake Archibald on the web browser event loop, setTimeout, micro tasks, requestAnimationFrame, ...
JSConf
808K views • 8 years ago
48:32Ryan Dahl: Node JS
JSConf
35K views • 14 years ago
3:32:50JavaScript: Understanding the Weird Parts - The First 3.5 Hours
Tony Alicea
4.2M views • 11 years ago
2:12:42Build Your Own Async
David Beazley
60K views • 7 years ago
28:39Netflix JavaScript Talks - Async JavaScript with Reactive Extensions
Matt Marenghi
69K views • 12 years ago
33:25Dan Abramov: Beyond React 16 | JSConf Iceland
JSConf
139K views • 8 years ago
36:31Hey Underscore, You're Doing It Wrong!
InfoQ
141K views • 13 years ago
40:55"Controlling Time and Space: understanding the many formulations of FRP" by Evan Czaplicki
Strange Loop Conference
69K views • 12 years ago
32:17Nathaniel J. Smith - Trio: Async concurrency for mere mortals - PyCon 2018
PyCon 2018
30K views • 8 years ago
27:21Daniel Henry Holmes Ingalls Jr.: The Live Web. Drag 'n drop in the cloud
JSConf
8K views • 13 years ago
1:06:34Introduction to Node.js with Ryan Dahl
InfoQ
758K views • 15 years ago
18:55[JSConfUS 2013] Tom Occhino and Jordan Walke: JS Apps at Facebook
JSConf
45K views • 13 years ago
58:08Parallelism, Concurrency, and Asynchrony in Perl 6 / Jonathan Worthington
yapcasia
6K views • 11 years ago
31:14"Make the Back-End Team Jealous: Elm in Production" by Richard Feldman
Strange Loop Conference
36K views • 11 years ago
1:06:46Crockford on JavaScript - Section 8: Programming Style & Your Brain
YUI Library
111K views • 14 years ago
2:34:01Crust of Rust: async/await
Jon Gjengset
246K views • 5 years ago
42:31"Datafun: a functional query language" by Michael Arntzenius
Strange Loop Conference
9K views • 9 years ago
1:12:10Practical Common Lisp
Google TechTalks
98K views • 19 years ago
41:06"Unison: a new distributed programming language" by Paul Chiusano
Strange Loop Conference
45K views • 7 years ago
27:42Mark DiMarco: User Interface Algorithms [JSConf2014]
JSConf
52K views • 12 years ago
20 comments from Hacker News
`latentflip-test` is from the same fellow who did the "What the heck is the event loop anyway?" JSConf EU talk that many have seen. ▶ this video
If there was a talk that explained and visualized the runtime state/how Smalltalk processes things (like this one for Javascript: "What the heck is the event loop anyway?" ▶ this video ), that would greatly help in understanding and coming to terms with it
You should be good to go after reading through the Rust book [0] and watching this video [1] [0] link [1] ▶ this video
I've been struggling with wrapping my head around asynchronous programming with callbacks, promises and async/await in JS, however I think it's finally clicking after watching these YouTube videos and creating a document where I explain these concepts as if I'm teaching them to someone else: * Philip Roberts's What the heck is the event loop anyway? - ▶ this video * The Story of Asynchronous JavaScript - link * JavaScript Callbacks, Promises, and Async / Await Explained - link * Async Javascript Tutorial For Beginners (Callbacks, Promises, Async Await). - link * Jake Archibald: In The Loop - setTimeout, micro tasks, requestAnimationFrame, requestIdleCallback, - link Edit... I've been rewatching these videos, reading the MDN docs, the Eloquent JavaScript book, javascript.info, blogs about the subject, etc. This further proves you shouldn't limit yourself to a single resource, and instead fill up the laguna with water from different sources if you will.
Not the parent, but I recommend understanding the event loop first: here [0] is a very good talk. Then, read the chapter on promise on javascript.info [1], as it explains the problems Promise set out to solve (callback hell), then as usual the excellent MDN article [2]. [0] ▶ this video [1] link [2] link
Haha, I'm genuinely intrigued to see the contents of that book. It could certainly be copy/paste from the Mozilla docs, but who knows! I was pleasantly surprised by this video about the JS event loop, although in fairness it is a lecture at a conference rather than a made for youtube video. Regardless, the length of the video made me question how necessary it was but I ended up watching the whole thing and enjoyed it. ▶ this video
This one is my all time favorite - What the heck is the event loop anyway? | Philip Roberts | JSConf EU ▶ this video
Yes, something like that. Like here's David's "Build Your Own Async" [1], which I prefer over Philip's (still extremely good) "What the heck is the event loop anyway?" [2]. It's one thing to tell how something works, but to successfully show what the hell its actually doing under the covers, just conveys much more information. [1] link [2] ▶ this video
I've been using JavaScript professionally for about 12 years. You're going to have to look for talks and really technical posts. Consider whitepapers and source code for JavaScript engines at this point. You'll probably want to start reading up on the things attached to JavaScript, rather than the language itself. Browser rendering, event loop, V8 things, garbage collection, etc. I'm sure you've seen it, but things like this: ▶ this video , and this: link It might be time for you to start writing what you know about JavaScript.
I got to know the nuances of the language by working with it for years and having to figure out why various things didn't work at different points, but it doesn't sound like that's your style. This isn't comprehensive, but it's probably the most helpful deep-dive I've ever seen about some aspect of JavaScript. It's about the Event Loop, which is one of the biggest differences between JS and comparable languages like Python: ▶ this video Contrary to what you might think, even though the event loop is in some sense "distinct from the language", it isn't simply an API. You can't really have JavaScript without the event loop; it exists in both the browser and in Node, and is the basis for most of the language's advantages.
Oh boy, I'm arguing over the Internet. Sorry for that. You do bring good points and I agree upfront that they are indeed JS features that either suck or are not very pedagogical. 1. You don't need to learn about the event loop straight away (or asynchronous programming) by the time you get to that concept, you might as well go to another language that's easier for that. But I do concede that once you get to async programming: JS is not the best language to learn from. With that said for people who got past the basics, here's an intuitive video about the event loop [1] (note: if you're past the basics, don't watch it while you're still doing the basics xD). 2. Basic objects are easily learnable with JS since you can type them in a literal sense, whereas otherwise you need to instantiate it with a constructor (e.g. Java) or you don't really learn about objects (e.g. C, though I've heared that it does have objects right? Despite it being an obscure feature, anyways, I'm not sure if you should be happy to learn about objects, learning about dictionaries or hashing is cool though). More importantly, when you start out learning programming, primitives + some HTML + simple objects are all you need to know. 3. Yes, try/catch is useless. I wouldn't call that basic though, but I'm already noticing we're differing on definitions (note: my definition was relatively clear, variables, if-statements, for loops and functions). And in coding bootcamps, the concept came long after I taught the
Another event loop talk from Philip Roberts. The tool he created to display the event loop in real time is fantastic. ▶ this video
1) Watch this: ▶ this video 2) Understand how `this` binding works. 3) Understand async/promises. 4) Learn debugging tools (`debugger;`, `$0`, how to turn on/off source maps etc.) 5) You will have to learn compiltion tools (babel and webpack)
Completely agree. Aside from learning the basics of the language (which if you already know any other "C like" language isn't difficult), gaining a good understanding of async flows (Promises then async/await) is absolutely key in JS and is probably the biggest hangup I see people run into. Where I work I'm considered the JS "expert", my coworkers consist of a few older seniors that mostly do backend work that think JS is bad/confusing language, and a few juniors that really only have experience with languages they learned in school (which probably doesn't include JS). And 90% of the issues I help them with are caused by a lack of understanding of async JS -- "why is this value undefined?" or "how do I get the data out of a Promise" and for the latter telling them "well, you don't get the data out of a Promise, you would chain it with .then(data => data) to operate/use the data" is usually met with even more confused looks. Though async/await helps a ton with how they use the data from a resolved async operation, you still need to understand promises (at least a little) since it's built on top of them (e.g. in a try/catch async block the lines after the await are essentially the function that gets passed to promise.then() and the lines in the catch block being the function that gets passed to promise.catch()). Two other things I'd like to mention (which could be under "learning the language") that I think really help with really understanding JS and being able to use it well
Be sure to understand the event loop. Javascript as an asynchronous language often comes back to bite beginners. Here are two great talks to help you: link ▶ this video Your life will be easier if you learn to use Chrome Dev tools (or the Firefox equivalent) early. In the beginning, you don't have to worry about browser compatibility - embrace modern JS (ES6+)!
Hey there, I'll start with the disclaimer, as lately HN comments have tendency of becoming toxic - everything I write is my personal opinion. With that behind us I can start. I'll try to write this for someone who knows very little about JS, but knows her/his way around basic programming/cs. Firstly I love JavaScript, I have been writing it for 10 years now, but there are bad parts of it as well. Let's start with good stuff * It is evolving in the right direction * You can do a lot of things with it (web apps, games, mobile apps, server...) * Materials for learning are everywhere * It will be easy to find a job Bad stuff * It is moving at crazy to follow pace * There are a lot of different ways of doing same things * As it is very hip thing to do, there is a lot of bu___hit (beware of the hype train) Learn plain javascript before moving to frameworks. Focus on ES6 and new stuff as it will make your life way easier. * Someone already mentioned Dr. Axel Rauschmayer, pick any of his books - link * Another good one is You Dont Know JS - link Try to make small app on your own. You'll get into all sort of problems, but that's the fun part I guess. That will help you to understand what frameworks are trying to solve. Then you can start learning one of the frameworks. React, Vue, Angular are all solid choices. My pick is React, as I know it best. Apply the same mindset as with learning plain JS. Try to write your own stuff on a small scale before importing huge libraries. Good ex
The corner stone of understand async JavaScript code is a deep understanding what happens under the hood with the Event loop. Philip Roberts has a great lecture called what the heck is the event loop anyway? [1] Once that video is watched once, everything else just makes sense. [1] ▶ this video
Paul Buchheit - Startup School Europe 2014 link Anjana Vakil: Learning Functional Programming with JavaScript - JSUnconf 2016 link Bret Victor - Inventing on Principle link Philip Roberts: What the heck is the event loop anyway? | JSConf EU 2014 ▶ this video
> How do I take, say JS, and learn it to the point where it really clicks to the point where I can visualize what's going on under the hood when I write programs? Learn how a JS engine works. Any engine will do, although V8 is very discussed on the internet. Here's a few things to get started with: - How the event loop works ( ▶ this video ). This show how JS works under the hood, what's part of "JS" and what's extended, how async operations are scheduled on a single thread. After watching this, everything will just "click". - How objects are represented in V8 ( link ). It's v8-specific but nevertheless tells you how objects are represented in memory. Keeping these concepts in mind, you will be able to write efficient code on the get-go. - ES6 spec ( link ). Optional reading (if you want to read 500+ pages), but it's a handy reference when in doubt. You can literally slap this thing to a person who doesn't know what they're talking about. Not that you should, but backing evidence is always great.
i cannot believe i didn't have the mental model outlined in this video (the intro video to the site) after developing for the web for so long. ▶ this video ...a great, very simple explanation.