Big Deno Changes

Monday. Monday. Monday.

Open wide dev fans, get ready to stuff your face with JavaScript, CSS, node modules, barbecue tips, get workflows, breakdancing, soft skill, web development, the hastiest, the craziest, the tastiest web development treats coming again hot. Here is Wes Barracuda

Boss and Scott

CSD.

Welcome to Syntax. On this Monday, it's a treat. We're gonna be talking about Deno and the changes coming to Deno in terms of big changes was the name of their blog post. Big changes ahead for Deno.

It. And, we're gonna be talking all about what these are, what these mean for you, and what this means for the web, and who is using Deno. My name is Scott Talinski. I'm a developer from Denver, Colorado. And with me as always is Wes Bos.

Hey. Excited about this. This this dropped Like a couple days ago, and we're like, oh, we definitely need to do a syntax about this because we've been talking about I think I feel like we talked about Deno for a while, and then we've just been talking about, like, JavaScript runtimes a ton lately with Edge functions and fun and all that. So big news.

Big news. Who would ever thought JavaScript runtimes have been getting this much airtime. Yeah. Yeah. This episode is sponsored by, 2 companies, one of which does not need to run or air. I guess it is in the air. One of which is in the air, the other which runs on servers.

One of these is Linode that runs on servers, and one of them is LogRocket, which flies in the air airtime, runtime. Got it? Bingo.

LogRocket is the perfect place to see how your errors and exceptions happen and how users are using your website with scribble video replays.

It. And this is like a game changer. If you like to see how things happen to both debug them, but to understand, it. You hate looking at just a bunch of flowcharts and graphs to see how your users are using your website, and you actually want to see in action like you're doing Almost like you're doing testing with users in the room. You get access to all of these features and more with LogRockets scrubbable video replay features. And these things are incredible in action, and I I like to debug a lot. When I'm debugging issues, I hate having to send that message.

What browser are you on? What are you doing to get this error to cause? What does your console say? You don't have to have any of that it with LogRocket. So check it out at logrocket.comforward/syntax.

Sign up today and get 14 days for free.

Let's talk about Linode as well. If you you wanna put Deno on a server, you could put Deno on Linode.

So Linode offers lots of like get up and going packages if you want to host Node or PHP or even a database. Linode will allow you to, use one of their images and just get up and running. But if you want to be able to put Deno on a server somewhere So you could host your Deno based website. You could totally put that on it because they just give you straight access to the Linux server. You can log in. You can use curl or whatever to install Deno, and you are up and running. Linode is an awesome cloud host. If you wanna get $100 In free credit, go to linode.comforward/syntax.

That's gonna get you a $100 in free credit. Thank you, Linode, for sponsoring. Sick.

See, man, I'm I'm standing for the 1st time ever recording, and I feel like I

I I feel the energy. I get it, Scott. Yeah. Yeah. It's really nice. I bounce around. I like yeah. I I move. I you know, do some, like, shimmy shakes here. Yeah. I feel like I need the, the Britney mic now, though, because I I don't wanna Stay in front of the mic. I wanna move around. Oh, yeah. Yeah. That actually that would be very fun. Definitely both just have Lab mics, and they're walking around. It's like we're we're doing the podcast, just pacing around our offices.

I have the, Like the NFL one. And now that I have I have 2 DBXs, I'm I'm curious if I could get it up and running. I plugged it in once, and it sounded awful. And I just, like, hold it. Just small diagram microphones.

Yeah. As opposed to your giant diagram microphone. But it's gotta sound like like 90% is good or 80% is good. It sounded like 10% is good. Yeah. Yeah. They're good they're good for live, but, yeah, if you want that fidelity in the recording and nothing beats a big mic. Alright. Dino, What is Deno ahead of, like, what we're we're talking about right now? Because some people out there even, like, don't necessarily even get How Node. Js relates to JavaScript in the browser.

So let's talk big picture, Node. Js, Deno, Bun, what are these things, and how do they relate to JavaScript in the browser, Wes? JavaScript is

just a language, And you might think of JavaScript as being just run-in the browser. However, JavaScript obviously runs on the server side as well via Node.

And that's not the only environment. Now we're starting to see a lot more JavaScript environments pop up. We have a whole episode on alternative JavaScript environments, and A big one of those was Deno, which is it takes, again, takes the the engine out of Chrome, but it allows you to It it it does a lot of, like, the lower level stuff in Rust, which allows it to be nice and fast and and whatnot. And it. Instead of doing proprietary Deno APIs, they they try to stick to web standards as much as possible. So Deno is just another JavaScript runtime. We also saw BUN JS come out again, and it's safe to say that we're now in a world where just like you have to run Your browser app in many different browsers, and those all use their own JavaScript engines.

We now have the ability to at least choose Where are or what engine each of our, JavaScript environments are gonna run-in. So Deno has been a very big one. It's made by Ryan Dahl. He's the guy who made Node. Js, So people are really paying attention. It comes with TypeScript support right out of the box, and they just announced a couple days ago some big changes ahead for The biggest one of them all is compatibility with Node and NPM, which is kinda interesting. So it. All the packages, in Node. Js land. So if you wanna use Express or, I And what are some other popular Node. Js packages? Literally, all of them. The entirety of the Node ecosystem. Yeah. Yeah. If you want to be able to use them, you sort of hit up a couple issues. First of all, they likely use some proprietary APIs that are part of Node like f s dot read file or read file sync or, any of the util dot stuff is built into Node. So what Deno has done, and this is not part of the announcement, they have Just replicated the entire node API so that a lot of those will work.

And now they're coming out and saying, okay. Well, people wanna be able to install and distribute packages on npm. Like, love it or hate it, npm is is kind of what we're we're here to stay with. Right? And if you want to be able to share packages and whatnot, It's actually a really good spot just to play with. Right? And so do you wanna explain, like, what they were doing before this? Yeah. Before this, it was just kind of

They're loading scripts essentially off of GitHub, and that's kind of how it's always been where you're just pointing your, essentially, your code, Your import you're pointing your imports to a URL, and that URL will then, like, load up the code essentially at that URL, and it caches it on the first it. Run it so that way you don't have an NPM. You don't have a packages that JSON and an install script. I find that kind of odd, because what happens is is that people end up just making a deps.ts file and then utilizing that deps as dependencies.ts essentially as it. A package dot JSON and then loading everything directly from that, which is, like, at that point, why don't you just make a package dot JSON? But I get it. You know? Yeah. And and this actually, this new way of doing it is still kind of using URLs. It's just being a special URL, or it's just npm colon and then the package and version number. And you have to specify the version number in this import, meaning that if you want to not have a bunch of long imports with version numbers and all of your files, you're probably gonna end up doing the depths dot ts file approach where you're running at once, which is just kind of like I mean, it's like, what if we had packaged it at JSON, but it was just a TS file? And honestly, I mean, if we're swapping out package dot JSON for a depths dot ts, I'd kinda take that. I'm kinda into it because you can have comments. Comments. Right. It. Yeah. You get comments. You can Yeah. Do JavaScript in there. And so that that part of it doesn't feel totally off to me in terms of, like, you know, As, like, a worse experience necessarily where I don't think I would want to have my version npm colon at version whatever In every single file that I'm using, I would probably end up using the depth set TS. But it kind of means that, like, what we end up having is is, like, We're we're we had these 2 separate ecosystems, and that was always my problem with Dino in the 1st place is that I'm not gonna use Dino. So I got a I got a no platform with all these note packages. Yeah. I don't wanna have to re like, somebody's reinventing all of these same packages. Oh, this is the express for Dino. This is the this for Dino, and it's like, well, we already have that. It already works fine.

Maybe it's already written in TypeScript. Right? So, like, now we can just utilize this core ecosystem of packages, that we've had in nodeland. And to me, this opens up it. In the same way that we'll kinda talk about BUN in a second here, but it makes these JavaScript server runtimes almost hot swappable. Not quite, But, like, if we could get hot swappable JavaScript runtimes and all of a sudden you just change one thing, whether that's No bun or dino instead of node in your site, and all your stuff ends up being faster because this new runtime is faster.

Hey. I'll take that all day. I I think we will eventually get there. I think people are building new modules now are Sort of charted it. We I I think we we sort of nicknamed it as a edge runtime or a worker runtime, meaning that You will try to build things so that they will work in all of these runtimes.

They work in a web worker. They work in Node. They work in Deno. They work in a CloudFlare worker, maybe even work in a browser. And that's obviously not possible. And sometimes you need specific APIs. Maybe you could write adapters, but I think we'll probably get there. Just like right now, like, we don't use Chrome specific APIs or A little bit, I guess. But, back in the day, adding an event listener, you had to write it twice. You had to write it once For IE, and you had to run run it once for the rest of the browsers. And that was a that's kind of where we're at right now.

And I bet with time, we'll sort of be in a spot where a hot swappable. Great great way to put it. Yeah. It's funny because some people were like, yeah. Well, jQuery. You know, it's up with Jake or jQuery, like, it. Like, one of the reasons why people like jQuery so much is because it removed a lot of those hurdles of working with Internet Explorer. So you gotta wonder if, like, Now all of a sudden, we're gonna have a utility pop up that's, like, makes it easy to make it hot. So I don't think that that will exist. But here's a little, an interesting little side project project. If those of you who out there looking in transforming code or getting into ASTs or any of that stuff, it would be kind of fun for someone To create either a an extension for Versus code or a website that copy and paste that just translates package.json into DEPS.ts.

Hey there.

Then you could just go from 1 to the other with 0 0 guff.

Yeah. That's actually not a bad idea. So the one kinda Cool thing with Deno is that you don't have to npm install this thing ahead of time. You simply just say npm colon the name of the package and then at, The version that you want.

Kind of interesting that I don't think there is a way to specify version ranges.

Oh, no, there would be, because at 5 would give you the latest version of 5.

At 5.1 would give you the latest version of, Like 5.1.9 if it was out. So, yeah, well, it will work that way. But this you don't have to install them. There's no you just run it and Deno will cache it at At a at a layer, so there is no

p n p m tricks to cache them or anything like that, which is pretty interesting to me. You know what's interesting to me, Wes, Is that if you do a command find on this blog post for the word bun, there's no results found. So, Dino is like, we're not going to be talking about bun. Right? But then if you go We don't talk about banno,

baby.

I don't know what song that is, but I like it. What's that? We don't talk about Bruno.

We have kids singing all the time. Oh, Bruno. Talk about it's from, a Encanto.

Oh, yeah. We didn't watch Encanto. Yeah. We didn't watch Encanto. It's a good one. It's a good one. Watch that.

It. So in this blog post, there's a whole section called the fastest JavaScript runtime, in which here you'd think they would even use the word bun. But instead, they say, we know there's been a lot of chatter recently about runtime speed. Competition is good for the ecosystem, but we refuse to name our competition it. Because we don't like that. We don't wanna give them any free promotion here. We are you know, I think that's kinda weird. Do you think that's weird? I don't know about like, it. To just say that there's been chatter and competition's good, but, like, not say what the competition is or anything. I don't know. I found that to be kinda odd. But, it. Basically, they're saying their goal is to make make Deno the fastest JavaScript runtime. And they're gonna be faster than all these on other unnamed ones because it's built on a v in Rust and can deliver Deno's HTTP server.

Oh, no. It says they can deliver this. Deno's HTTP server is getting overhauled. It. Yeah. Happy to report that this is the fastest JavaScript web server ever built. Well, I think that's pretty exciting because

So to those who'd be like, well, like, who cares? I'll just build a faster one. So every language, Node. Js, BUN, And do you know sorry. Not every language. Every implementation has a web server built into it. And They build these web servers in the low level language. So node is written in c, I believe.

Bun is written in Zig, And Deno has written in Rust, and they are able to a web server is a very low level thing. It can handle Thousands of requests. It can send a response as fast as possible.

All of those things need to be as fast as it. Possible. And that's why those HTTP servers are written in the lower level languages, and then they surface them to mere mortals like us via JavaScript So we can just use them. Right? And you you still might go ahead and use, like, an HTTP server like Express or Fastify or something. But all of those things, Expressify, they are using the internal HTTP server, APIs.

And that's really exciting because If that means that the issue p server is faster than anyone out there, then that may be a reason why you wanna go ahead. It might make Even like like, imagine a 20% faster web server that could speed essentially. Yeah. For free. And that could that could both speed up your, How much you're paying for your server as well as, as the the end result for people who are, are visiting your website. So it's pretty setting as well. I I I gotta wonder about Node in 2022.

Like, we use Node. I've never had a lot of concern with Node, but Here we have Dino saying we you just use TypeScript, right? TypeScript out of the box. No transformation. You have, bun, you just use TypeScript out of the box. No transform. And then notice over here just kinda being like, oh, common JS and ASM. There's, Yeah. Big big issue. You know? And I don't hear any chatter about node supporting TypeScript out of the box, and maybe that's fine that they don't. But, like, I gotta tell you that it's not a lot of fun to have to always transpile all of your code, just to write some simple stuff, and I don't know if I'll want to write JavaScript without TypeScript again. When I do, I don't have a great time to the point where I like, alright, I'll set set up typescript and do all that whole rigmarole yeah in anything I'll transform it but now instead of doing the whole rigmarole and setting it up I'm probably just gonna use bonnardino to do those typescript kind of processes, and if I can use Xenia now. Yeah.

Or bun with node stuff, then, Man, what's the reason to use node? Yeah. Especially, it's slower. It's less compatible. It's, you know, it it's starting to feel like the old dog even though, like, What? Like, a year ago, bun wasn't, you know I mean, bun existed, but it was what it is. Flower a year ago. It was what? It. Just flour flour sheets.

Did you see the bun? Jared Jared, who's creating bun, had made, like, a He had made some sort of graph that showed, like, how fast different versions of bun was.

Yeah. Like, he had all the different version names of bun, and it was so funny. They were all, like, different types of buns. Like, one was, like, bow. One was and I was like, this is the cutest darn thing in the whole world to have all the different version names after different types of buns.

That is great. So Adena was saying they're gonna support up to 80, 90% of NPM packages, which is Jeez. Amazing. I'm assuming the ones that won't be supported are the ones that have, like, compile, like, compile time dependencies.

Maybe not. I'm not sure what the the holdup would be because they have full almost full node support already. So It's pretty exciting to see this type of stuff coming down the way. And I also wonder like, there was some chatter on on Twitter being like, do you think Node should have A TypeScript loader or compiler built into it. And, like, again, we've went down this thing with jQuery. We thought the browser should have jQuery built in.

But Is there something they can do to make the authoring experience a bit nicer with TypeScript in Node? I you have to think that there's They're talking about that. Although all the node everything node does is open. All their meetings, everything is is open, so maybe tune in to one of their next. Yeah. It's funny. So there I found, like, a GitHub issue from 2018

where they're basically like, well, you can, you can always transpile it, And that got, like, a 1,000,000,000 thumbs downs. But then now it seems like there's a new issue as of July 13th this year. So what? We're 4 years later from Mateo it. Yeah. Who who says, like, how could we support TypeScript without vendoring it? TypeScript changes too fast.

Put it in the show notes. I'll put it in the show notes here.

And it's this this is from July of this year, so it's modern, and it's up to date where There's still people talking. The let the latest comment on it was 10 hours ago, so, people are talking about it. But who knows If this is something that will will come about or where they're at, I'll have to paw through this whole whole, whole thing for now.

But, yeah, man, I gotta I gotta wonder, like, next year at this time, if we're looking at bun, Deno, and Node. Js and saying, Node is the least enticing of all of these options, which feels weird to say, but I I I mean, if you're looking as it is right now, you got 2 faster dogs. You got 2 dogs with more more features, and then you have this The slower older dot it's not even slow. Node is not slow. No. But it is relative to the other options.

If they're All things considered, you can just author TypeScript and they're faster. It's like, what where's the downside? I guess the downside is compatibility

and legacy. I I even wonder, like, are we gonna see Parcel and Vite have runners for these things? Yeah. I mean, you know, that that's that's another option is just just run vite server dotjs or dot ts, and then it It will do all the compiling and running and restarting under the hood for you. So that because that's another option. It's just Like, the tooling needs to be a bit easier.

That's the big gap. And there there is lots of stuff you can install, but none of it is None of it's perfect. You always got to install TypeScript and tsconfig, and it's it's too much right now. So something's gonna happen for sure. I mean, I love the SvelteKit approach where you have these different adapters,

and there is an adapter Deno in an adapter bun. So you could output your Svelte could cite to run as Deno or BUN in production. Obviously, that's not the dev server, but, hey. I think that might just be the future. Hey. Where do I want this to output? Hey. I wanted this to output on the faster one. That one. Okay. Go. Pre preset e n v for JavaScript runtimes.

2 other little announcements from Dino is they're supporting enterprise users, which is good because sometimes Companies will not want to buy into a specific tech unless there's literally enterprise that you can buy. Like, you can have office or pay, that's why, like, Node. Js has they have something where you can pay an expert to do certain things. Companies need that. So There's that, and then they also are announcing a, full text symbol search across the third party library of Deno code. So it's kinda cool. You could search. It looks like a Versus Code plug in that you'll be able to to go through. I'm not sure what the benefit of this would be over, what Versus Code already does, but It's kinda interesting to to find packages, maybe. Yeah. But it looks like, like the ability to search for symbols, which are Functions and variables and and definitions and typed, types inside of your codebase, interfaces, enums.

So I'm not sure.

It looks like they've generated some sort of, like, GUI that allow you to

search through your codebase. Well, sec. I think this is fascinating.

You know, we're turning, returning definitely the the rocket boosters on the, JavaScript runtime world. And, Man, I I gotta say it's exciting to me because I don't have to be the one working on Node, BUN, or Deno, and I get to reap the benefits of it. So Yeah. Sounds great to me. Awesome. Thanks, everybody, for tuning in. We'll catch you on Friday. Peace. Peace.

Head on over to syntax.fm for a full archive of all of our shows, and don't forget to subscribe in your podcast player Or drop a review if you like this show.