 Hey, everyone. Alex here. See this hourglass? This simulation is using an existing open source physics engine that's written in C right inside my web page. How's this happening? JavaScript calling a native C library? My friends, this is the power of WebAssembly. Let's go. WebAssembly, or Wasm for short, allows you to run native code like C, C++, and other languages in your user's browser, just like any other JavaScript code. Wasm is well suited to two use cases in particular. First, if you work for an enterprise with lots of legacy code and application logic, you can easily bring that logic directly to your user's browser. And secondly, if you want to bring a modern library to the web without having to rewrite it in JavaScript. For example, you could use a cutting-edge multimedia or simulation library in your web page using existing code. So today, we're going to use a physics engine in our web page, courtesy of Wasm. Let's take a look. What I'm trying to achieve is to let the physics engine tell me where to place all the grains of sand in my hourglass. So on each tick of the animation, I need to ask the physics engine what the positions have moved to and update the DOM so things paint in the correct place. Let's take a look at the JavaScript that we want to use to trigger the physics engine. Here, we just use the request animation frame callback to call into the physics engine to update its view of the world. Once that's run, we re-back all of the sand grains positions and update the DOM as you can see here. This is all fairly straightforward. Note that the IDs on the circle elements use a number to map into the physics engine model so we know which grain goes where. Now, let's take a look at the C interface to our physics engine. It's pretty simple. CM step is the function that triggers a run of the engine, and CM add circle is the function that creates a ball inside the physics model. Finally, CM getLocation is the function that retrieves the position of a ball after the physics engine has run. To build all this, we need two things. One, we need to expose the C functions that we want to call from JavaScript, and we do so by passing these flags to the compiler. And two, we simply compile using emcc from the script in SDK. The result of the compile is two files. One is a JavaScript file that's the glue between the JavaScript world and the Wasm world, and the second is the Wasm module itself. And that's it. WebAssembly is a really cool, modern part of the web. It's also not just for C or C++, as tool chains are already appearing for other languages. You can try building all this yourself at home by following our code lab. And also be sure to check out the resources in the description below. So remember, if you've got legacy code bases, or want to share code between native targets on the web, use WebAssembly to get your code there fast. That's WebAssembly, the standard way. Sam will see you on the next tip. Hey, Sam, is this the WebAssembly episode? Yeah, it's going really well. Oh, cool. Could I maybe do it? Yeah, of course. I'll move. Oh, cool. Nice. Demosol, let's see.