Rust Programming Language Other Conferences 2017, 24 Aug 2017

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: WebAssembly In Action

Description

Watch this presentation to learn about the recent updates on the state of WebAssembly and view a short demo of Rust programming language interacting with the land of browsers.

EVENT: CinciJS

SPEAKER: Chris Nelson

PERMISSIONS: The original video was published on the GaslightLive YouTube Channel with the Creative Commons Attribution license (reuse allowed).

ORIGINAL SOURCE: https://www.youtube.com/watch?v=gdTcKq3FJuI

A

Webassembly, how many people have heard of webassembly, yet so most people, maybe about half, so that's, what's kind of cool. So what we're gonna talk about today, we're gonna talk about what webassembly is I'm gonna, try to give some context around. Why and why it's important and then I'm gonna do a demo and we can actually look at one of the other demos on webassembly org as well.

A

So, first of all to understand why webassembly is interesting and cool I think it's fun to kind of like climb back into my Wayback Machine with me, how many people are doing web development in 1995, okay, cool, like a few people? Okay, awesome! So in 1995 there was this browser called Netscape and right it.

A

So I did my internship in college in 1995, at Nationwide, Insurance and I was mostly doing sequel at sequel server, but I kind of had this side thing where I was building them to some web stuff and right during that summer, probably in the spring, actually Netscape version I, don't know I want to say 100. Maybe it was one one shipped and Netscape had that version of Netscape had two new things in it.

A

It had a language called JavaScript which was brand new and it turns out written by a guy named Brandon, Naik I want to say in like 10 days, and it had this language that everybody already knew about, which is this up-and-coming language that was getting more and more attraction and people were excited about called Java and at the time JavaScript was definitely the afterthought. It was like this really kind of like people saw it and- and they advertised this, like kind of almost a little toy for making your web pages more interactive.

A

But if you wanted to do like serious hardcore software engineering in the browser you wanted Java. That was like the tool that you were supposed to use to do that, and so it's obviously super interesting that, like nowadays, Java and the browser is dead as a doornail and JavaScript is like this user group that you're sitting at so like that's weird what happened? Okay!

A

So let's talk about why Java in the browser failed? It made me really sad because I was like a Java guy man and I was like all over the java to java for 10 years. I ran the Java user group.

A

All the things so I was super sad that it didn't make it at the browser, but basically, why it failed, mainly is Java was like a bolt-on virtual machine that ran outside of the browser and basically like you could write Java applets and they took over this little tiny rectangle in the middle of your web page, and you could do things there, but it was clearly bolted on and it was clunky and it was slow and it was like this bolted on thing and had not real seamless integration into the web browser in very late versions of Java.

A

You could finally talk to the rest of the web page from Java, but by that time it was already almost dead and it was too late. So the idea of Java, being a virtual machine in the browser, actually gave us a lot of the same abilities that webassembly Willis will see here in a second, but it ultimately failed. But the idea of wow what if we could have a virtual machine in the browser and we could write whatever language we want. It's actually not new.

A

We tried it once already and we're like just going in this giant circle and I just find that like super super interesting, maybe nobody else cares. But anyway, let's talk about web assembly. What is web assembly web assembly according to their website, web assembly or wisdom, is a new portable size and load time, efficient format suitable for compilation for the web.

A

What what's that mean? Okay, what it really really actually is- and this is why I thought thought context was cool. It's really a virtual machine for the web again.

A

So what's different this time and why is it actually going to work so here's what's different web assembly is not a Bolton, separate virtual machine where you can execute code.

A

It turns out, as JavaScript got more and more mature, rather than this little interpreter that Brandon Ike wrote in ten days people optimized JavaScript, so it would be really really fast and in order to do that, they basically had to add a virtual machine that executes your JavaScript can do just-in-time compilation, compilation, compilation, excuse me, can optimize your code and do all sorts of low-level goodness and magic to make JavaScript fast enough.

A

So all the browser's at this point in time have some kind of JavaScript virtual machine built into them, and what web assembly is doing is exposing the internal browser. Vm, that's already there. So, rather than being a bolt-on we're saying like what, if we could like directly expose the virtual machine and possibly skip the fact or not care about the fact that javascript is the the language that this virtual machine knows how to execute natively. What if it could execute whatever language that we want to so I should have added a slide here.

A

How many people already know what a virtual machine is? Okay, that's most people that just for the people that didn't raise their hands really really quickly.

A

When you write computer programs, you compile those computer programs in whatever language that you wrote them in down into machine language, zeros and ones that your CPU that little chip inside your laptop can execute.

A

If you have a different kind of chip, you need to compile it. I can omit the right kind of instructions for whatever kind of computer chip. That is a virtual machine, is basically an idea which says that what, if, instead of compiling into actual machine instructions that can execute on whatever CPU I have what? If I made up this, pretend computer that had a set of instructions that I define and I compile into this pretend machine language.

A

The advantages that this pretend machine language, it's easier to translate that at the lower level into the actual machine language, and so that's the idea- and it also makes it really easy to make a compiler once that can compiles into a some pretend machine language format and I, don't have to write a separate compiler for every different kind of computer chip. That's on the market, that's the basic idea of the virtual machine.

A

So that said, exposing that means I can write in whatever programming language I want. The other thing that's different. This time is cross browser support, so web assembly, like I, couldn't believe this actually happens when I saw it happen. But web assembly is actually there's commitment to support across Chrome Firefox and ie Chrome, as you might guess, Chrome and Firefox are done and edge is still coming along, but there's actually like official support across all the browsers to be able to support it. So that's right: what's that oh yeah Safari, sorry, my bad I.

A

Assume edge becomes IE, eventually, I, don't know, I, don't know how it works.

A

Yeah I'm sure it's like the future, the future Microsoft browser or whatever is whatever they call it. I have trouble keeping track of all those things, but the point is like the Microsoft browser platform will also adopt this as and it's like underway with it. The other thing that's really really important is it does have well-defined J s bindings. So when you build something in web assembly, you can talk to it and execute things from JavaScript.

A

It's a it's as we'll see it's a pretty clean, easy to work with a layer of talking between the two and that's that's what I'll demo? That's what what we'll look at together in code.

A

So why would you want to do this so, first of all, I think it's really cool to be able to execute languages other than javascript in the browser thanks miles.

A

Obviously this is a Java users group. So like yeah, that's the thing and I'm not here to talk trash on JavaScript, but I like freedom of choice as a developer, I want to be able to choose what I want to use to do whatever I'm doing when it comes right down to it. Java scripts got a ton better and maybe I'll keep choosing it but like not having to I.

A

Think is awesome, also, there's some definite performance benefits that was in promises and especially if you're doing things like hardcore 3d graphics, whatever in the browser being able to optimize code by dropping down to a lower level languages. Interesting, so is it ready yet kind of we'll see like what are the things that are good now and we can do and what are the things that are like stay tuned coming soon?

A

So what can I do right now? I can execute plasm format, so wasm format is like a binary format of these imaginary machine language. Instructions basically I think it's a little higher level abstraction than that. But I don't go. Look at the binaries to see what they are I'm, not that interested so browsers. Right now, like Chrome right now, today, stock chrome can just execute blossom. I didn't have to go to Crenn Erik canary to do it. I didn't have to turn any chrome flags on I just brought up my wasum demo and poof.

A

It works. So that's pretty cool and I'm. Pretty sure. Firefox is the same way.

A

There are compilers that can emit wasm that binary format and the key one is LLVM, which is a kind of a virtual machine. Compiler back-end I'm, not an LLVM expert, but it's basically like a compiler back-end that lots and lots of languages use and so rust is the example. Language I'm, going to look at rust, using LLVM can compile into this wasm format, so the two languages that you can actually practically do stuff with in wasm so far the ones that I can find working examples for our C and rust.

A

How many people have heard of rust at all? Okay, so most people, actually that's pretty cool, so rust, is a it's I think it's mainly like a systems level, programming, language that Mozilla came up with, and it's a pretty low-level language designed to write operating systems and things at that level. It's basically it snitches to be a more productive c c is like a really old school language been around forever and rust is trying to fill that same Nicias c. So it's it's pretty low level.

A

You can do things like memory management yourself in rust and see yeah. You got to do memory management yourself, so they're both pretty low level languages and it might occur to you- and it certainly did to me like. Why do I am I limited to such low level languages? Why? Why?

A

Why aren't all the languages in the world just like jumping on this and building compilers, that Amit wasn't I will answer that question in just a, but let's go ahead and jump in and do a demo, so I thought it was really cool to actually do true language choice. I don't know Russ at all, so I'm just sort of like stumbling around, but I got a demo and was able to actually write some of my own Russ code and see it actually work in the browser.

A

So I thought it'd be really cool to see that so, let's jump into the code and then I'll actually run it cuz. The demo is frankly, the least exciting bit sadly, but let's start with a file of rust, so for those that haven't seen rust. Hopefully this is I, don't know what I'm doing either, but this was mostly self explanatory Mew.

A

What's that font bump, is that what you said how's that everybody able to read that okay cool so like most languages, I start with a main function? This main function is what gets executed when my wasm module loads from the browser.

A

It knows how to translate print line, which is like the internal like puts their system.out.print line of rust. It actually sends that to the console. It knows how to do that. Much and then I'm, defining two functions, add and multiply that are self-explanatory. I think rust is a typed language, so I have to tell it my parameters and my return value are all in 32s.

A

Something else that's interesting, probably or at least I'll give you a little context. These are all like. Take numbers and return.

A

A number type function, I actually tried and wanted to say, like oh I, think it would be cool to do some string, manipulation, I'd, like a little hello function that took a string and return a string actually working with strings in rust and then sending them back to the browser turns out to be non trivial because I'm, not yet an expert enough with memory management in rust to know that, like a string well, I, don't know how many bytes that is ahead of time.

A

I gotta allocate the right amount of memory and then I got a deal with sending that back into the browser, and that was like too hard for me to do so. Like literally writing. A HelloWorld function was required more brain power than they had I had in the hours that I spent at it yesterday. So that gives you an idea for like what level we're at right now we're like way down here so I'll talk about like how that's gonna get better here soon in a little bit, but right now, yeah.

A

The only thing I was smart enough to do. I started with AD and I created, multiply myself so yeah, not not super rocket science II there. So that's what the rust file looks like I am cheating a little bit. Let's look at my index. J s file well, I'll start with index dot, HTML, so I'm using webpack.

A

How many people are web pack familiar a little bit so web map is a bundling tool that takes care of like bringing all my JavaScript together in one file, maybe transpiling from one javascript version to another lots of like plumbing type work.

A

There is a web pack plugin, which runs the rust, compiler and builds my executable for me already. So basically, all I had to do is start with the example project and, as we can see here in my JavaScript, I can actually require rust files and use them, and web pack knows how to do all the work for me to be able to make that happen. So this require actually web pack is taking care of the details of running the rust compiler on this file emitting a wasm binary format.

A

We can see it over here yeah, it's not so readable, it's binary, but there it is anyway. So webpack takes care of running the RUS compiler outputting. The right thing when I make changes and the way I interact with it through JavaScript, looks like this I'm using require, which webpack gives me and getting to this wasm module.

A

It's also given me a few shortcuts to the wasm api. If I was using the raw web assembly, API I would have to do a little bit more work, but not a lot.

A

I'm calling initialize I am passing this flag. I actually had to add this. When I first started working with this demo, it didn't work. What happened was I would load my functions, but by the time I tried to execute them, the run time would have executed would have exited, and it would tell me that runtimes no longer around you can't execute that function anymore, which was kind of awkward, so I had to pass this extra flag in here.

A

To tell it hey, don't let the runtime exit execute please, because I want to actually be able to use. Those functions anyway seems a little silly, but that's what I had to do so. This initialize actually like fires up the wazoo stuff, and it returns a promise where my wasm module gets passed to me after it's loaded. This module is what contains the executable rough stuff and how I bridge that executable rough stuff into JavaScript is with functions on that module object and the only function that I'm using here is called C, wrap I.

A

Don't know why it's called C wrap, I I, guess that gives you a feel for like hey, it's designed to be talking to see mostly I presume. That's the case in my case, I am actually wrapping a rust function, so it'd be nice if it was called something else, but never mind. I am wrapping an ad function and I need to tell it all the type information.

A

So that's important when we're going from like totally different environments, one to the now the other. Somehow the system has to know how to map types from one environment to types in another environment and the JavaScript primitive types. It knows how to do that with, in this case I'm just using number. That's it. I had issues with string like I said so this says: hey this function returns a number and then that last argument is the parameters.

A

I have two in there, both numbers, so I get back a function, a JavaScript function from that module, C, wrap call and then, finally, once all that's done, I'm able to just invoke those functions as if they were JavaScript because effectively they are so just so. You can actually see this is working.

A

Let's actually change this to lie and we'll just like multiply a times a times B and in my code over here now it should be 18. Instead of six did I get my arithmetic right, I hope so, thanks, Dan, okay, so I have the server running in that project over here, I have a compiled task that just runs webpack on it, and so, if I do npm run, compile.

A

We can actually see it do its thing. You can see it actually compiles that rust file.

A

Okay, npm run serve.

A

And now, if I go back here and reload, this hello world.

A

We can see that it actually outputs hello world, says I'm calling Russ functions from JavaScript, outputs, the result of add and the result of our multiply, which is a lie, so it actually works. I can actually execute Russ compiled code. In my browser, I know it's not visually cool, but for me like as it the implications of it are pretty exciting and yeah. That's my tempo, such as it is, let's see so I promised like there was a question that I'd get back to you and that is like.

A

Why can't I use higher-level languages like Ruby and crystal and whatever, whatever or whatever, and it turns out there's some features that higher-level languages expect from their runtime. The principle ones are a garbage collector. If you think about a language like Ruby, you never have to allocate memory yourself, you just make objects willy nilly and there's. This thing called the garbage collector that keeps track of who's using those objects and, if nobody's using those objects that cleans up that memory for you, so that you don't run out of it. The other Oh memory management.

A

You know that's a typo, I'm, sorry garbage collector and memory management. That's just different ways of saying the same thing. The other bullet point should have been threading. That's the other thing that most modern runtimes expect you to be able to have, or most higher-level languages expect out of their runtime is the ability to do threads. So those are the features needed by languages. Here's the complete list of feature, those features that are supported by web assembly. Currently, as you can see, there aren't any.

A

However, what's cool is all of those things are actively on the roadmap and if we I should have actually left a link to this over here. But if you actually go and find some of these features, you can actually yeah host MVP features document. So all of these things so right now we're WebP assembly at is that is the MVP has just now shipped and been declared like done we're done with the MVP and the MVP is just like.

A

Can we execute plasm code and the browser, and we saw that happen, and we can do that? The next things are like. How do I build out this platform so that I could support higher level languages, as you can see there, the key bits that we're gonna need garbage collection and threads are underway right now and if you want to, if you track through these issues, you can actually go find that there get repositories with code and them for a lot of them and people actually working on that stuff. So that's pretty cool.

A

It's low level, now, probably not practical for a widespread use, but I am I'm optimistic that it's gonna get there.

A

So oh I already did that. Oh I didn't mean to say that yeah, so that's kind of the future. These things are coming along, they're being supported, cross-browser I think the future for a web assembly is really really bright.

A

There are some free go to the web assembly page like the demo is actually pretty cool. It's actually like a full unity game that they have ported to output, wasm code. So like this is like not you know. This is just a little bit better than my demo. Just like that. Much.

A

But this is running a full 3d game using wasm. I haven't actually tried it, yet hopefully it works. I didn't verify that.

A

Seems like it's starting: okay, yes doing something! Oh you can't hear the little silly sounds that it's playing. Oh look: I've got a little tank. I bet, I can shoot stuff, uh which one is mine, I'm moving the red tank, but when I press the space part, the blue tank shoots so yeah. Maybe they've got some issues to work out there. I guess, but it's still like using unity, which is what real game developers use and it actually works. So yeah, that's kind of my schpeel any uh any questions on web assembly.

A

I'm most excited about language independence, so I see languages, maybe not Ruby, but I. Think it's more likely a language like crystal, which is very closely related to Ruby and uses LLVM I think crystal will might be one of the first ones that I'd be interested in, because I think it already uses LLVM any languages that are based on LLVM. I bet you it will ship first, so pearl actually might be one of the first ones believe it or not. Two.

A

Pearls, the one that springs to mind, I'm, pretty sure, Perl 6- is all a VM base. I don't know, does anybody else know of any I mean obviously rust crystal I I could look it up, but there's probably quite a few.

A

Anything else or any other questions, I mean.

A

Alright, well, that's kind of all I got next month. Hopefully I hope you hearing about view Jas and if you want to talk about webassembly or anything, I'll hang out here for a few minutes thanks, everybody.