Introduction to Node.js Q&A: ES Modules & Latest JS Features

Transcript from the "Q&A: ES Modules & Latest JS Features" Lesson

[00:00:00]
>> Speaker 1: Just versus common JS. Just how do you deal with-
>> Scott Moss: The [CROSSTALK]-
>> Speaker 1: The fact that yeah, in the browser when you are writing browser code. You are doing ES.
>> Scott Moss: Yeah, so there's a lot of different scenarios. So ES modules in the browser is relatively new and there really aren't any patterns for them.

[00:00:22] So the way people have used ES modules in their browser now is they actually use a build tool like Webpack to compile it for them. So what you would do is you would write your code as if the environment that your code was gonna run in supported all of these features.

[00:00:36] It supported the ES modules. It supported all of these latest and greatest features, like async/await. But then before you actually ship that code to your browser, or to the browsers of your users. You would use a tool that would convert that code to something that every browser could understand.

[00:00:52] So basically that tool would convert ES modules into some hacky implementation of CommonJS modules that it built. And it would run that in the browser for you. So it would make it compatible with your browsers and that's how you would handle that. As far as using ES6 modules natively in the browser, patterns just haven't been discovered yet.

[00:01:13] I'm still waiting on people to actually understand how to use that in a better, more efficient way. But the way you would do that is still very much like a script type. You would just put a module ID on it and say what module it is and you would leave it up to the browser.

[00:01:25] So it's very similar to what you would do in Node, except for you still need script tags, because the browser still needs to load up files. So you can't get rid of script tags. But yeah, most of the time, you're just gonna use Webpack. You're gonna use Webpack, or Parcel, or Rollup, any type of module bundling system, Browserify.

[00:01:41] I mean, pick your poison, there's so many of them. You're gonna use that to convert your code into something that a browser can understand. And you can actually do that on Node, too. If you want features that Node hasn't supported yet, you can use Webpack to convert that to something that Node can understand.

[00:01:55] And it's just a great tool.
>> Speaker 1: Is it weird to use Webpack for Node, since Node is not the web?
>> Scott Moss: Yeah, it is kind of weird. I find myself using Webpack for Node sometimes, but what I really realize is that you don't really need Webpack for Node, most of the time.

[00:02:11] Most of the time, you just really need Babel, right? You really just need, I need all these extra features that the current version of Node doesn't have, so you use Babel to transpile. Because what Webpack does, it creates a bundle of one file, and all this stuff. You don't need all those optimizations for Node.

[00:02:25] You don't need to minimize and bundle your code in Node, because it's not running on a browser. There's no download speed, there's nothing over the wire. It's just running on a machine. So you don't need to optimize for those things. So webpack is an overkill. So yeah, I do find myself using things like TypeScript or Babel independently from Webpack for new applications, mostly because I don't need a bundled app for Node.

[00:02:46] In fact, you probably don't want a bundled app especially if you are creating a module that you are sharing. Could you imagine somebody using your code, that they downloaded it. And then they want to go look to see, there's a error. So they go look at your source code and it's just like one line of minified code, it's just like whoa!

[00:02:59] What am I supposed to do with this? So you probably don't want to do that. So yeah, Webpack for Node might have been overkill, but the transpiling is, I use Babel for everything so can't get away from that, yep.
>> Speaker 1: So will Node try to support all of the JavaScript features, the new JavaScript features?

[00:03:20]
>> Scott Moss: Yes, Node is on top of it. Like I said, there was a small little war, I guess you could say, a couple of years ago between people that forked Node, and the creators in the foundation around Node. Because at that time Node was moving really slow, it just wasn't keeping up with the latest features or doing anything that the community wanted.

[00:03:40] And they were being really political about it. So somebody forked it and made something called io.js. You can literally just Google io.js, even NVM still allows you to install io.js. And io.js is like, we're Node, but we support all the latest stuff, because Node's dragging their feet. So they did that for a while and I remember even just using io.js for everything at one point.

[00:03:59] And then Node was like, okay, you've proved your point, can you please come back? And we'll do better, I promise. So that's basically what happened, and io got merged back into Node. And then now Node is like all right, we're going to start this new standard where we release things every couple of weeks.

[00:04:14] And we're gonna have lifetime support, and we're gonna fix security issues, and we're gonna do all this stuff. So now Node is very onboard with supporting the latest stuff. And in fact, they normally have the latest stuff before browsers do, like async/await. All this really cool stuff, Node usually has it before a browser does.

[00:04:29] It's just that when it comes to modules, they're kinda shot themselves in the foot, because they already implemented a module system called CommonJS, right? And getting the switch to work for ES modules without breaking every single Node app ever written since then, it's really tough. So they're trying to figure out, how do we natively support ES modules without breaking everything else?

[00:04:48] So that's the problem they're having, whereas a browser doesn't have that problem, cuz they never had modules to begin with. So their first module system was ES modules. So that's the only problem that Node has right now is converting that. Everything else is pretty much on board. Yeah, Node pretty much has everything.

[00:05:04] The only reason I use Babel for Node is because sometimes I might be deploying to an environment that's only Node 6, but I want Node 10 features. So I use Babel for that. But if I use the latest Node it pretty much has everything that I need. I don't really need to transpile everything.

[00:05:19]
>> Speaker 1: We're asking what your theme is.
>> Scott Moss: This one.
>> Scott Moss: What's the theme of the day today?
>> Scott Moss: Man. It's material theme Ocean/High Contrast, and then my font is Operator Mono, that's why it's cursive and stuff