Out of the JavaScript Box: Front-End Rust Programming

on YouTube ↗44m

" summary

Rust compiles to WebAssembly to replace heavy JS work: a Tetris implemented as 460 lines of Rust produces a ~22KB .wasm binary, reduced to 19KB after wasm-opt, with only 65 lines of JavaScript as glue. Build uses wasm-pack, wasm-bindgen and cargo; webpack can bundle the result. WebAssembly runs without GC in its own linear memory, so the app minimizes copies (one memcpy per frame at 60fps), imports Math.random from JS, and trades predictable performance for explicit memory and interface design.

AI-written summary · about

" chapters (28)

1. 0:00Intro
2. 1:07Tetris
3. 1:27WebAssembly
4. 2:16W3C
5. 3:24Why not use JavaScript
6. 4:05JavaScript is a compilation target
7. 4:42JavaScript is a bad assembly language
8. 5:43JavaScript is unpredictable
9. 8:00Performance JavaScript
10. 8:20Nojs
11. 9:44AwesomeJS
12. 10:34JavaScript
13. 11:19JavaScript Problems
14. 15:52WebAssembly vs JavaScript
15. 16:59WebAssembly Documentation
16. 17:21WebAssembly Changes
17. 17:47Event Handler
18. 18:08JavaScript Event Loop
19. 20:47Memory Management
20. 21:46Rust
21. 22:26Rust Description
22. 24:15Package Manager
23. 29:00JavaScript File
24. 29:12WebAssembly API
25. 31:38Summary
26. 38:23Tools
27. 39:06Twiggy
28. 40:18Questions

" related talks

• 30mImproving web app with Rust and WASMIlya Baryshnikov · RustCon Asia 2019
• 41mLet's build with WebAssembly!Tejas Kumar · JSCamp Romania 2019
• 33mWebpack + WebAssembly the futureSendil Kumar N · Amsterdam JSNation Conference 2018
• 43mDo things blazingly fast with WebAssemblySendil Kumar N · Voxxed Days Ticino 2018
• 43mWhy you should consider Web Assembly in your next frontend projectHåkan Silfvernagel · NDC London 2021
• 25mThink About Front-end Web Development with RustYosuke Onoue · RustFest Global 2020
• 47mRewrite the web with Rust and Web AssemblyGeoffroy Couprie · Voxxed Days Luxembourg 2018
• 30mRust in the Browser for Javascripters:New Frontiers,New PossibilitiesSean Grove · ReactiveConf 2019