Creating a Webassembly App in Rust

Опубликовано: 12 Февраль 2025
на канале: buckmasterinstitute
7,396
112

Creating a Webassembly App in Rust

Created and recorded by Jaysinh Parmar in May 2021

Outline

1. Why WebAssembly with Rust over JavaScript?
2. Install dependencies needed
3. Fetch standard template
4. Demonstrate how to build webassembly application
5. Modify code to import alert from javascript and export the modified alert from rust to wasm
6. Run the webserver

Introduction

Explain the motivation behind selecting rust for webassembly over javascript:
Reliable performance
Small code size
More detail (https://rustwasm.github.io/book/why-r...)

Dependencies
1. Get rust toolchain (rustup, rustc, and cargo)
2. wasm-pack, which is your one-stop-shop for building, testing, and publishing Rust-generated WebAssembly. Get it from here: https://rustwasm.github.io/wasm-pack/...
3. Get cargo-generate to help us quickly build new Rust project by leveraging pre-existing templates (cargo install cargo-generate)
4. Get npm

Create WebAssembly App
1. Clone pre-configured default template to quickly build, integrate, and package rust code for the web. (cargo generate --git https://github.com/rustwasm/wasm-pack...)
2. Show the contents
3. Show the main function which uses wasm-bindgen to interface with JavaScript
4. Import alert from Javascript
5. Modify it to custom message and export it
6. building requires multiple steps but "wasm-pack build" congregates all the steps
7. Show the content build command generated
8. Init wasm-app (npm init wasm-app www)
9. Show the content
10. Modify the dependencies in package.json to include our rust program
11. change index.js to import rust source code
12. npm install
13. npm run start
14. Show the result

Ending remarks
Thank and point to more resources (Tokio, Yew) to build more complex webassembly applications