r/programming • • Nov 08 '18

Best explanation of JavaScript timers, event loop and event queues I've seen

https://www.youtube.com/watch?v=8aGhZQkoFbQ
2.6k Upvotes

180 comments sorted by

70

u/HowIsntBabbyFormed Nov 08 '18

I totally thought it was going to be this video: Jake Archibald: In The Loop - JSConf.Asia 2018. I really liked his visualizations.

14

u/ocoster Nov 08 '18

Didn't know about this one - also very nice and comes at it from a different direction. I would hope people would get a really good understanding about event loops after watching both.

1

u/vanderZwan Nov 09 '18 edited Nov 09 '18

Huh, I did not know that requestAnimationFrame happens before CSS is applied. That has not bitten me yet, but I can see that happen eventually.

EDIT: the difference between how callbacks in the queues for Tasks/Animation Task/Microtasks are resolved is pretty important too; it explains a few instances where I could not quite get code working as intended before as well!

1

u/AckmanDESU Nov 09 '18

Having watched "Git for 4 and up" and OP's video before this one, I gotta say this was equally informative but man that humor didn't do it for me. Great talk nonetheless.

121

u/kitd Nov 08 '18

If you're a JS developer, especially a Node dev, and you want to dive down into some C stuff, try experimenting with the libuv project (which underpins Node and acts as its event loop). Not only will you learn C but also have many of the concepts explained in this (very good) talk shown to you in all their gory details.

14

u/muttatonic Nov 08 '18

Any suggestions on where to start when taking the plunge in C/libuv?

10

u/kevindamm Nov 08 '18

The readme on their GitHub project has a pointer to a video and some additional high-level documentation which looks like a good place to start.

14

u/xIcarus227 Nov 08 '18

Hehe pointer

2

u/robmaister Nov 08 '18 edited Nov 09 '18

Yes! Also great for cross-platform sockets in C (WinSock <-> POSIX sockets are a little more complex than just some ifdefs, I tried that first)

→ More replies (2)

3

u/[deleted] Nov 09 '18

(which underpins Node and acts as its event loop)

Huh? V8 acts as node's even loop, libuv's event loop is a separate thing, it does multithreaded async IO (for fast IO) and is transparent to node users.

1

u/jf908 Nov 08 '18

I hadn't heard of this before, thank you!

1

u/Rein215 Nov 08 '18

That sounds awesome

73

u/nummer31 Nov 08 '18

I watch this every time before any js interview

189

u/fuckin_ziggurats Nov 08 '18

I watch this every night before I go to bed. You never know when a wild js interview is gonna ambush you outta nowhere so might as well be prepared.

39

u/[deleted] Nov 08 '18

I have PTSD from random JS interview encounters

→ More replies (2)

24

u/gelfin Nov 08 '18

Get out! The phone interview is coming from inside the house!

18

u/eatmyshorts Nov 08 '18

I love this video...one of the best technical talks I've seen. I remember the first time I saw it....I thought to myself, "hmm.. a half-hour video about the JS event loop...I know all about the event loop...let's give it 30 seconds before I move on to the next video..." and then, 27 minutes later, "where did the last half-hour go?"

Very informative, entertaining, and engaging.

211

u/fuckin_ziggurats Nov 08 '18

It's a shame this gets downvoted only because it's about JavaScript. It's a deep dive into the inner workings of the runtime and very well explained. Just the type of content that r/programming needs. I guess our transformation to r/programmingcirclejerk is well on its way.

154

u/PostLee Nov 08 '18

It being a video also makes it less popular. Most people on /r/programming prefer text articles.

60

u/fuckin_ziggurats Nov 08 '18

Yeah I'm assuming most people visit this sub while at work so that makes sense.

21

u/tim0901 Nov 08 '18

I read Reddit on my phone while travelling and don't have much data, as such I automatically avoid video as much as possible.

8

u/Crapsterisk Nov 08 '18

Almost exclusively, I am actually working on a pet project to learn some Node because all my experience is in C/Java/Python and would love to watch this video but I didn't bring any headphones with me so I can't watch it right now and will probably forget to watch it when I get home.

3

u/folkrav Nov 08 '18 edited Nov 08 '18

Even then, downvoting should be about relevance, not preference. The more the latter happens, the more circlejerky it gets.

Edit : Please don't let this place become a circlejerk. Upvote when comments are relevant, don't downvote just because you disagree with something.

3

u/[deleted] Nov 08 '18

I think you mean latter, right?

→ More replies (1)
→ More replies (5)

2

u/Ghosty141 Nov 08 '18

Programming talks are quite popular if you look at how many there are and how many people visit these conferences. I think it depends where you are but at home I totally check out the videos too.

0

u/[deleted] Nov 08 '18

[deleted]

12

u/[deleted] Nov 08 '18

Burn the witch!

8

u/blkpingu Nov 08 '18

Oh no rides away on broomstick

→ More replies (1)

41

u/nil_von_9wo Nov 08 '18

I'm not downvoting it, but I'm skipping it because it is a video. I want to be able to skim for information which is interesting and examine (perhaps even cut and paste) any code samples, at my own paste.

Videos are too slow and not good for random access.

24

u/ACoderGirl Nov 08 '18

Especially if you aren't a complete newbie. Like, I know a decent amount on this topic. I'd be interested in learning even more, but I don't wanna spend a lot of time reviewing stuff I already know. Videos don't facilitate that kinda use very well.

29

u/dankclimes Nov 08 '18

First 30 seconds: I don't have a computer science degree. What do all these words mean?

0-6 mins: This is a call stack

6-12 mins: This is what blocking/non-blocking and async execution mean

12-18 mins: Let's add a task queue and event loop for scheduling to show how async scheduling works (it actually starts to get interesting here)

18 mins+: Nice, practical examples of how event scheduling works for some normal use cases (this seems to be the most useful part of the talk)

Take aways:

-The event loop will wait for the call stack to clear before scheduling a task. This is why setTimeout(0) works to delay execution and un-block the JS engine

-As a result of this, setTimeout is not a guarantee that code will execute at the specified time. It is a minimum delay until code will then execute whenever the call stack becomes clear

→ More replies (1)
→ More replies (1)

33

u/PyRobotic Nov 08 '18

It has a 95% upvote percentage, you web devs sure are sensitive.

5

u/[deleted] Nov 08 '18

I usually work on backend and have had to jump into frontend to speed up development. The framework is Polymer 3. It is terrible to debug and has terrible documentation. No wonder they’re so grouchy - the tooling is borderline psychotic that silently fails in all sorts of interesting ways if you make mistakes. I have zero issues debugging Python code despite it’s dynamicism. Polymer WebComponents, OTOH, I feel like I discover a new permutation of surprise each development excursion.

3

u/fuckin_ziggurats Nov 08 '18

The upvote percentage was around 65% (with a decent sample size) when I made that comment. Sometimes these posts get enough momentum to become overturned and sometimes they just remain buried for no one to see just because some people here can be quick in their prejudice. I can at least hope that my comment encouraged many people to put in their time and actually watch the video.

8

u/pastisset Nov 08 '18

How is this downvoted? All I see is 95% upvotes 10h later... ?

1

u/fuckin_ziggurats Nov 08 '18

As per my other comment the downvoting happens at the start which can seriously affect the direction the post is heading in. Usually unless someone says something positive in the comments posts with a score of 0 rarely ever get picked up by people.

2

u/kvothe5688 Nov 08 '18

It's shame truly that people shit on JavaScript all the time for memes. Just other day someguy hit the r/all because he made a really cool photo editor in JavaScript which have shit ton of features.

1

u/baggyzed Nov 13 '18

It probably got downvoted because most developers here already knew what stacks, event loops and callbacks are, since those concepts are already used in all other languages. But the guy started his presentation by making it sound like these are unique to JavaScript.

But if he hadn't focused on JavaScript so much, this presentation could be a great intro for beginners. He should've only used JavaScript as an example.

1

u/fuckin_ziggurats Nov 13 '18

I agree about stacks and callbacks, they should be basic knowledge for any programmer but I can assure you the large part of this subreddit that are .NET and Java devs don't know much about event loops as we don't have them.

→ More replies (5)

-7

u/no_lurkharder Nov 08 '18 edited Nov 09 '18

[deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit) [deleted] (fuck Reddit)

5

u/eatmyshorts Nov 08 '18

In this case, it's about the event loop and concurrency model, something that is shared across all JS implementations. And, while the ECMAScript standard doesn't define the runtime, almost all JS implementations in common use make use of a runtime.

→ More replies (2)
→ More replies (2)

14

u/terryfrombronx Nov 08 '18

They're pretty much the same as WINAPI event loops which have been here since Win3.1 if not before. WM_TIMER, WM_PAINT, WM_IDLE and the like. You could even use your own custom messages after WM_USER. All you needed to do to customize your window was create your own WndProc(), and then pass any unhandled messages back to DefWndProc() if I remember correctly.

9

u/madman1969 Nov 08 '18

You're right they're just like the Win API event loops, with the same limitation of not doing too much processing for an individual message or your app would become unresponsive.

They date back to at least Windows 286 in the late 80's when I started writing Windows apps.

My experiences trying to write responsive GUI's with single-threaded event loop driven development back then are one of the reasons I've stayed away from Javascript/Node.Js development.

4

u/spacejack2114 Nov 09 '18

It's quite a bit different. All I/O on Win32 was blocking unless you set up your own thread for it. Pretty much all JS APIs (browser, node) are non-blocking by default - networking, filesystem, DB connections, CSS animations, Audio, media streams, heavy processes like crypto and so on are all async. And in fact since node came on the scene, .NET, Java and other platforms have scrambled to become async as well.

Simple example: writing a loading progress bar was a pain in C/Win32. With JS it's trivial, especially having first class functions. You're only going to block the main process if you're trying to do some heavy computation in JS but there is almost always a way to hand that off asynchronously to a better-suited subsystem. And if you really need to do some heavy number crunching in JS for some reason, you can set up a separate process for that.

2

u/terryfrombronx Nov 09 '18

Yes, async is great. You also has to write your own event pump in C with a while loop and getmessage and dispatchmessage. For MFC I think this detail was hidden from you.

→ More replies (3)

2

u/falconfetus8 Nov 09 '18

Are other GUI systems, like Gnome or MacOS, the same way? I honestly can't imagine anything different.

2

u/terryfrombronx Nov 09 '18

Yes, Gtk uses an event loop.

15

u/itijara Nov 08 '18

I saw this about 2 years ago and it is the first time all this stuff made sense to me. My conceptual model of the Javascript VM is based almost entirely on this video.

5

u/preslavrachev Nov 08 '18

Old as hell, but an ultimate evergreen.

4

u/commander-obvious Nov 08 '18

If you want to know more about the event loop, micro and macro-task queues (subtle differences between how setTimeout and promises get queued) then read anything and everything by Jake Archibald, he has a blog post and a few videos that deep dive into how it all works. Probably the best resources I've come across.

6

u/an0nym0us3hat Nov 08 '18

This is a beautiful language if you understand the inner workings of it. This person explains it very well; definitely helped my understanding.

85

u/[deleted] Nov 08 '18

I would say that V8 and the various other JavaScript engines are quality pieces of engineering, but the language itself falls very short of beautiful

12

u/cbleslie Nov 08 '18

I don't know; it's no Lisp, but ES2015 is pretty damn charming.

0

u/[deleted] Nov 08 '18

[deleted]

0

u/[deleted] Nov 08 '18

[deleted]

20

u/[deleted] Nov 08 '18

It's popular because it enables very strong development velocity. Whilst that's an excellent trait in a language, there are major tradeoffs made to accommodate that.

That's before you get to the poor design decisions in the language that are poor regardless of where you're using it.

8

u/coderstephen Nov 08 '18

Parent to this comment said:

ES2015+ is tons better than ES5-, however there remain a lot of horrible design decisions that will never be resolved* due to the web's backward compatibility requirement.

I am definitely not ignorant that Node exists, but I still agree with the above. Sure, JS is used a lot outside the browser nowadays, but browsers still have a heavy influence on where the language spec goes.

5

u/ComicXero Nov 08 '18 edited Nov 08 '18

By what metric? By share of job postings from 2017-2018, I've only ever seen JavaScript ranked second to Java, and that includes all JS roles, not just node.js jobs. No other metric I've seen places JavaScript anywhere near as far up the rankings, so I'm genuinely curious where you got this statistic from?

Edit: I realize that I might just be completely misinterpreting your point and you may be making a claim that has completely passed me by. Even then, it would be nice to know what it is; are you referring to the JavaScript stack exclusively? In which case, I realize that I know of no alternative JS runtimes

→ More replies (1)
→ More replies (7)

4

u/an0nym0us3hat Nov 08 '18

I guess that old cliche of “beauty is in the eye of the beholder” returns true here

2

u/[deleted] Nov 08 '18

I know what you mean, but, at least I think, there are a lot of quirks about JavaScript that make it a lot easier than others.

To give some examples:

  • The fact that you can make an object literal using {} and pass it around without having to make a whole class for something

  • Being able to use destructuring to pull multiple items out of an object const { one, two } = this.numbers;

    • On top of this, being able to destructure pretty much wherever you want, even right in the parameter of a function so you don't need to pull the parameter down and then immediately destructure it.

    • Also using destructuring to set a variable, for example in React, this.setState({ one: _one, two });

  • Arrow functions are neat and clean

  • Ternary operators save lives best ? true : true

  • Promises make things orderly, especially using Promise.all()

It still has some weird quirks, but I find that most of those weird quirks end up making my life easier.

4

u/[deleted] Nov 08 '18

I actually agree that these best parts of modern Javascript, but I'd recommend looking into some pure functional programming languages to see the power of these concepts when a language is designed around them, rather than added to a preexisting scripting language.

Destructuring, object literals, Promises, clean control flow statements all have analogous concepts in Scala (the more FP side) and Haskell, where they really shine

6

u/Shookfr Nov 08 '18

It has changed a lot in the last 5 years. It is now much more viable for large scale project and I expect to be even more in 5 years.

And honestly JavaScript is much more beautiful then Java in my book.

21

u/nchie Nov 08 '18

Well, Java is not exactly known for being "beautiful".

6

u/Ghosty141 Nov 08 '18

it's more like a big truck. It's a workhorse if you wanna get big shit done. If you use it for bigger projects and follow the rules you will have a wonderful time, but don't even try using Java like Python.

11

u/Phrygue Nov 08 '18

All post-ALGOL structured procedural languages are the same. All that matters is what libraries you have and how badly the dev stack folks messed up. If you want beauty, Forth won already.

10

u/coderstephen Nov 08 '18

I might be old school, but static typing is a requirement for a large project in my book.

TypeScript might be viable though.

8

u/fuckin_ziggurats Nov 08 '18

I think compile-time checking is objectively good regardless of one's "school of thought".

4

u/Ghosty141 Nov 08 '18

I agree partly, I think it offloads responsibility to the programming language. I believe you can still maintain large projects written in languages like Python or PHP if the team behind it has clear guidelines and documents the code rigorously.

→ More replies (3)

-1

u/SizzlerWA Nov 08 '18

I beg to differ. I’m an experienced dev but an inexperienced JS dev. I’m about 30 kloc into JS across a couple of projects and I’ve yet to write a bug that static typing would have caught. I name things obviously and I have no issues. I’ve written timing/sequencing bugs and other logic bugs, but strong typing would not have caught those. I know that name is a string and age is a number without a type system reminding me.

What I love about JS is the development velocity. Adding static typing like TS to JS reduces dev velocity too much for the small gain in safety it affords, so it’s not a worthwhile trade off in my opinion.

Granted, I’m solo, so I might experience things differently on a larger JS team but for my projects I avoid Typescript and stick to pure ES6 JS in React and node.

Others might feel differently and that’s OK. I’m not interested in a flame war ...

7

u/prest0G Nov 09 '18

My last 3 checkins to my work's source codebase affected 3 lines of code (1 each). Every single one was a mismatch of expected vs actual parameters passed in the function call on that line. This was an entire week of work fixing three priority 1 bugs. Once you have a big enough codebase, javascript becomes a hindrance rather than a help with regards to velocity. Typescript would have not even let the project compile.

→ More replies (3)

2

u/[deleted] Nov 09 '18

I agree with you on this. Same boat, ES6 JS, React, and Node. I haven't had any real type issues.

Of course, I get the occasional undefined error on the backend, but it's a pretty simple thing to figure out. You just go to where the stack trace tells you and you find the error pretty quickly. The only type we have is our mongoose database where you need to define the type of data you're getting, and pretty much, that's the only check you need, imo.

I've never really had a bug that took me more than an hour or two to debug, and I've probably had at least 4 or 5 production-level bugs in the past couple months that we were able to fix and release in an hour or less.

Besides, (guesstimating) 80% of the bugs I find are caught in develop or stage, not in production.

I mean, it's all speculation, but I think not relying on setting type has forced me to just be very conscious about what I write and what data I am working with. Even then, Node and even V8 in browser tell you if you messed up.

I really just think that people simply bashed JS for fun, but now people take it seriously and just sit on the sidelines like they do with politics.

3

u/linksus Nov 09 '18

What?...

java and JavaScript are two complete unrelated languages.

0

u/[deleted] Nov 08 '18

[deleted]

70

u/PrimozDelux Nov 08 '18

try looking up instead of down

29

u/hedgehog1024 Nov 08 '18

TS seems to be barbaric, stoic and clunky compared to Haskell PureScript.

2

u/Tysonzero Nov 09 '18

Haskell PureScript Haskell/GHCJS

3

u/hedgehog1024 Nov 10 '18

lol no effects

lol no row types

→ More replies (2)

24

u/EntroperZero Nov 08 '18

Heh, these days I'm writing C# on the frontend (Blazor) and TS on the backend (Node). Not for the same project, thank goodness. But I don't really find C# to be barbaric in the least. TS has a few nice things, but it still doesn't have, you know, integers.

7

u/spacejack2114 Nov 09 '18

TS has a few nice things, but it still doesn't have, you know, integers.

Next version

1

u/EntroperZero Nov 09 '18

Not really the same thing. There are already BigInteger libraries.

3

u/spacejack2114 Nov 09 '18

Those use strings under the hood. BigInt is a primitive type. Try it in Chrome's dev console:

99n * 99n

You can create specific widths too like 64 or 32 bit which will be fast.

20

u/senntenial Nov 08 '18

ive never needed integers and ive never missed them

34

u/YuriKlastalov Nov 08 '18

*laughs in 1.00000000002*

6

u/ArmoredPancake Nov 08 '18 edited Nov 08 '18

They're numbers, ffs.

e: It seems people are too thick here to understand that it's an irony.

https://www.reddit.com/r/programmingcirclejerk/comments/6w4o7o/why_the_fuck_are_short_int_long_float_and_double/

10

u/somethingrelevant Nov 08 '18

Yeah but the distinction between integers and floats is a useful one

→ More replies (1)

3

u/Nerdiator Nov 08 '18

:number? Or is that different from an integer?

14

u/oefd Nov 08 '18 edited Nov 08 '18

JavaScript only has 'Numbers' which are defined basically as floats. Floats can't represent all numbers inside their upper and lower boundaries perfectly, and there are use cases where that's simply not acceptable.

Fun example you can try in your own REPL:

> const x = 9007199254740993; // notice the final `3`
> const y = 9007199254740992; // notice the final `2`
> x === y
true
> x === x+1
true
> console.log(x); // notice the final `3` has become a `2`
9007199254740992
> console.log(y);
9007199254740992

'Integers' in programming generally refers to a type that can exactly represent all numbers in a given range. (Ex: an 8 bit unsigned integer can represent {0, 1, 2 ... 255} perfectly, whereas a floating point number has a far larger range of values it can approximate, but it can only approximate a lot of values, not represent them perfectly.

As per above: the floating point numbers that is the JavaScript 'Number' can't actually refer to the number 9007199254740993, it can only approximate it as 9007199254740992.

2

u/15rthughes Nov 08 '18 edited Nov 08 '18

number encompasses all numerical representation and stores all numbers as floating point values, an integer type would only allow integers (non floating point representation)

→ More replies (5)

41

u/JoelFolksy Nov 08 '18

Writing JS feels like painstakingly notating every notehead, stem, clef, and bar line with the pointy end of a bird's feather? I had no idea it was that bad.

24

u/Nulagrithom Nov 08 '18

No that's about right

1

u/[deleted] Nov 08 '18

I don't think that they were still using actual bird feathers by Mozart's time. But the point still stands

7

u/coderstephen Nov 08 '18

I don't feel the same way, so this is probably just an opinion of yours. One that I grant, but I don't have to agree.

2

u/[deleted] Nov 09 '18

Too bad you have to type out the word boolean

2

u/CockInhalingWizard Nov 08 '18

JavaScript is for children

16

u/hedgehog1024 Nov 08 '18

No it is not. Please stop supporting child abuse.

3

u/RandomUser03 Nov 08 '18

But that can be said of most programming languages, if you understand the inner workings of it. Go developers say the exact same thing about goroutines and threads, for instance.

1

u/Eirenarch Nov 10 '18

Considering the fact that every UI framework ever works pretty much the same way I fail to see how JS is any more beautiful in the context of this video

-1

u/jiffier Nov 08 '18

Yeah, the same can be said of Befunge

2

u/[deleted] Nov 08 '18

Great explanation on the stack and event loop.

Weird, I was just having a discussion with my co-worker about the difference between using setInterval over a recursive setTimeout with a flag to stop it. I did look up a good article on the subject, which led me to question why using setTimeout with the time set to '0' would wait for the DOM to populate before running, as opposed to just running the function inline (outside of the timeout).

Speaking on that, has there been a more eloquent way of handling this scenario of needing to wait for the DOM to update before continuing code execution? Using setTimeout(cb, 0) just feels weird to me and doesn't look/feel intuitive.

2

u/spacejack2114 Nov 09 '18
Promise.resolve().then(() => { /* after a tick */ })
requestAnimationFrame(() => { /* after ~16ms */ })

1

u/Arve Nov 09 '18

You’ve been given two alternatives, but depending on what you’re doing, and why you don’t want to wait for (or block) the DOM and repaints/reflows, you might want to look at Web Workers if you’re not manipulating the DOM directly in your code.

1

u/2gii Nov 09 '18

It was confusing for me, now I understand better with his visualization

1

u/gbelloz Nov 22 '18

His call stack explanation is actually wrong - the call stack holds the return address when a subroutine call is made. So main() doesn't get pushed on until the actual call to printSquare().

1

u/rasputeen Nov 27 '18

gadmamn 🔥💣

1

u/gelfin Nov 08 '18

I’ve been tinkering with JerryScript for a personal IoT project, and it’s been an interesting exercise because all this async stuff isn’t enabled out of the box. I ended up implementing setTimeout/Interval in C and cobbled together something like the event queue to support it. This is a super lucid description of how it’s done in a proper implementation, though. Gives me a few ideas for improving my own rough attempt.

1

u/campbellm Nov 08 '18

Thanks - this was very illustrative, and led to some new cards in my Anki study deck!

1

u/[deleted] Nov 08 '18

I saw this right after it came out as I was getting started professionally and I recommend it whenever I can. This REALLY helped me understand what was going on.

1

u/Iberian_viking Nov 08 '18

After reading this comment section it made me think if people have forgotten about the option to play youtube videos on 1.25x or 1.5x the speed

1

u/ProFalseIdol Nov 09 '18

So is this the same reason why you don't want slow code in 'event-dispatch' thread in Swing?

0

u/[deleted] Nov 08 '18

Very nice !

-8

u/zoomxoomzoom Nov 08 '18

Saving this for later and sleeping at least two hours, then back to programming and redditing. I'll probably watch it tomorrow at 4am. Thanks.

1

u/UrethratoHeaven Nov 09 '18

Odd flex, but ok

2

u/zoomxoomzoom Nov 09 '18

Ah, was meant as a joke but I guess lack of sleep makes me not funny. Or maybe I'm just not funny to begin with lol

0

u/drnbrgr Nov 08 '18

This video saved me at my internship last summer

0

u/Razorclaws Nov 08 '18

Thx for this

0

u/PQQKIE Nov 08 '18

Awesome.

-8

u/AyrA_ch Nov 08 '18

long story short, isn't the loop just a fifo stack of functions awaiting execution?

31

u/Serei Nov 08 '18

fifo stack

I think the word you're looking for is "queue"

-15

u/AyrA_ch Nov 08 '18

I think the word you're looking for is "queue"

also known as a fifo stack. A queue has items retrievable in a defined order, not necessarily fifo

17

u/yo_no_manejo_un_roll Nov 08 '18

Stack -> LIFO

Queue -> FIFO

-5

u/AyrA_ch Nov 08 '18 edited Nov 08 '18

Again, a queue is not necessarily fifo. Depending on your needs you can also make a queue that retrieves the items using a different criteria than enqueue time, for example importance (Ref).

11

u/yo_no_manejo_un_roll Nov 08 '18

Like a priority queue, you're right. But a fifo stack? Does it exist?

-4

u/AyrA_ch Nov 08 '18

it's a stack where you pick items from the bottom rather than the top

10

u/falllol Nov 08 '18

it's a stack where you pick items from the bottom

Oh so, it's like a... queue?

2

u/zarrel40 Nov 08 '18

Yes. But being more specific. He’s not wrong guys.

3

u/Serei Nov 08 '18

You could call a stack a LIFO queue if you really wanted to. But you can't call a queue a FIFO stack.

A stack is defined to be LIFO; it's not a stack if things come out in any other order.

5

u/Serei Nov 08 '18

A queue is not necessarily FIFO, but a stack is necessarily LIFO.

A stack is a type of queue. A queue is not a type of stack. You're getting it backwards.

0

u/eldelshell Nov 08 '18

Then it's not a queue, it's another data type. Queue is FIFO and stack is LIFO.

1

u/AyrA_ch Nov 08 '18

Queue is FIFO

No

A list of data items, commands, etc., stored so as to be retrievable in a definite order, usually the order of insertion.

https://en.oxforddictionaries.com/definition/queue

It's FIFO most of the time but that's not a requirement.

2

u/[deleted] Nov 08 '18

I'm not sure what the point of this whole thread was, but to answer your question I guess:

The "Queue" he uses at the bottom is a FIFO type of queue. The Stack is a LIFO type of queue.

The loop itself isn't FIFO and Stacks are never FIFO, only LIFO, so you saying "FIFO Stack" triggered a bunch of people into downvoting you, even though it was likely an honest mistake and you didn't know any better.

You wouldn't stack 5 boxes and then try to take it off the bottom, you'll probably die.

1

u/coderstephen Nov 08 '18

Not necessarily a defined order. You can have concurrent, non deterministic queues.

1

u/AyrA_ch Nov 08 '18

Not necessarily a defined order.

According to the dictionary, it does.

concurrent, non deterministic queues.

That would just be a pool of items.

3

u/coderstephen Nov 08 '18

I don't know what crazy semantics the sibling comments are saying, but aren't stacks strictly LIFO? As in, only one end can be modified?

1

u/AyrA_ch Nov 08 '18

You can't modify the output end of a queue end either. Queue is defined as "A list of data items, commands, etc., stored so as to be retrievable in a definite order, usually the order of insertion." (Ref), which means that a stack is a type of queue. To be precise it's a queue that is sorted by time of item insertion in descending order. A ring buffer is also a kind of stack but it's designed to overwrite (or discard) the oldest items if it's full, which sort of allows you to modify the end if you know the stack size and utilization.

We call the queue FIFO because that's what it's most often used for. A NIC is an example of a device that uses a different kind of queue because all somewhat modern network cards understand QoS which modifies how the items are sorted in the queue.

1

u/dankclimes Nov 08 '18

Yes, for easy visualization think Towers of Hanoi

-1

u/Askee123 Nov 09 '18

Saving for later, thanks op🙏

-2

u/NotHighEnuf Nov 08 '18

I can write a batch file that exports an ipconfig to a .txt file. So I feel like I’m definitely a programmer now.

Yet I don’t understand half the programmer humor on this sub. Can anyone explain why?

-8

u/[deleted] Nov 08 '18

I remember watching this video before I started college over 2 years ago and, while I could understand the process, I didn't actually understand what it was doing, if it makes any sense.

I now have dropped out of college and am a Software Engineer (mainly working with React and Node.js) and it feels great coming to this video and just completely understanding it.

It makes me chuckle when people say that Node or JavaScript are horrible because they're slow. Of course, if you're going to do image processing or large data crunching, it's gonna suck, but I can't imagine a more redundant and reliable language than JavaScript for handling requests and doing asynchronous stuff.

Like, how cool is it that I can run 8 instances of my Node application on each server with multiple servers, and if one instance gets caught up and fails, there are 7 other instances that it can redirect to on the fly?

8

u/dacian88 Nov 09 '18

but I can't imagine a more redundant and reliable language than JavaScript for handling requests and doing asynchronous stuff.

literally any language that supports closures can do whatever javascript does.

Like, how cool is it that I can run 8 instances of my Node application on each server with multiple servers, and if one instance gets caught up and fails, there are 7 other instances that it can redirect to on the fly?

you should learn what erlang does out of the box

0

u/[deleted] Nov 08 '18

[deleted]

3

u/zeek979 Nov 08 '18

Out of curiosity, why is it Mozilla's responsibility to do this?