Check out a free preview of the full Web Assembly (Wasm) course

The "Writing Web Assembly" Lesson is part of the full, Web Assembly (Wasm) course featured in this preview video. Here's what you'd learn in this lesson:

Jem shares a more complex JavaScript code example that includes multiple conditions and demonstrates how that code would be written in Web Assembly. Since writing Web Assembly can be very verbose and difficult to visualize what values are on the stack, programmers will use a higher-level language like AssemblyScript which compiles to Web Assembly.

Preview
Close

Transcript from the "Writing Web Assembly" Lesson

[00:00:00]
>> I hope everybody wrote the minus one function, because, [LAUGH] honestly you see how tedious it is to write web assembly by hand, and working with stacks and things like that. Is it fast? Yes. Is it efficient by computer standards? Yes. Is it efficient by engineering standards? No.

[00:00:18]
It's very difficult to reason about. And in fact If we took a more complex example, it's called the function example. You don't have to write this, this is purely information absorption right now. If we did something a bit more complicated, where we wanna create this function in web assembly.

[00:00:35]
So if I wanna create a function that takes in a number, check this if it's equal to two. And if it's equal to two, I wanna return that number multiplied by two is equal to three. I wanna turn that number multiplied by three. Otherwise, I wanna turn that number multiplied by itself, it's an arbitrary example doesn't really do that much.

[00:00:53]
But in JavaScript it's pretty easy to reason about, right? You can look at this, I wouldn't even have to tell you what it does, you can imply exactly what's happening under the code. But in web assembly, something that is relatively simple at a high level language becomes much more complex.

[00:01:11]
For example, okay, good local, we're pushing the local variable the stack, makes sense we understand that. We're declaring a constant to, makes sense as well. We can see that because we're compared to the number two, we declared number two here. We know that equals the operation takes two numbers off the stack and checks if they're equal.

[00:01:32]
Cool. Then what? So the if statement checks the validity of what's on the stack before, because equal is gonna return. I wanna say it returns a 1 or 0 based on if it's true or false. But you have to know that the if opcode checks the most recent thing on the stack and executes that.

[00:01:55]
If it's true, it jumps into here, where we declare two again, we multiply and returns this year. I don't have to have the return, but it's implied. And then we keep doing that and so on and so forth. But, you really have to memorize opcodes and understand what they're pulling from, what's on the stack of the current moment, all of this is not intuitive at all.

[00:02:16]
You can't, I mean, some people can. But I personally can't look at this and say, I know exactly what's happening. Because the flow control just doesn't make sense in a way that I would wanna write this manually. And we can see that writing web assembly by hand. Well, it's just not that practical.

[00:02:36]
Fortunately, because web assembly is not meant to be written by hand, we only generally are looking at what files when we're debugging. We wanna write higher level languages that through a series of tool chains compiled down to web assembly. And that's what we're gonna do for the remainder of the course.

[00:02:52]
So, if you wanna write more web assembly, feel free. If you wanna get really, really into it, go ahead. You now know how to do it, you understand how opcodes work, you understand what modules and parameters and the stack machine looks like and how it works. But, generally, we're gonna write in a higher level language that will compile down.

[00:03:13]
It's still good to know how to read web assembly just in case you need to debug it. But hopefully, if we've done things correctly, [LAUGH] you'll never have to do that. Because, well, as you can see, this is a really simple function and it gets really long. It only gets worse, trust me.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now