WASM: Running GO in browsers

Talk at GopherCon Turkey-2020

Web Assembly AKA WASM is a new way of running high-level languages into the browsers. Cases where you need to do complex computations like gaming, 3d rendering, AI stuff, etc in any language you want(which has support for WASM), it is something you definitely should try out.

Web assembly is a new concept, it's not a language which you would require to code in, it's a binary format which gets ported into the browser directly.

It gives a great performance, portability, no more deployment dependency, offers a variety of languages to code in, best suitable to the nature of the problem.

Transcript

1. Ekta Garg | @_ektagarg WASM: Running GO in browsers Software Engineer @GROFERS
2. Agenda • What is WASM? • Why do we really need it? • WASM support in GO • Examples and demo • When to target WASM?
4. WASM is a binary instruction format …. Smaller files Fast loading and Execution
5. … Designed as a portable target for compilation of high level languages ... Compile target for LLVM supported languages. Security/ sandboxed
6. … Enabling deployment on the web for client and server applications ... Shared code base Less deployment
7. We already have javascript for browsers. Why do we need WASM? what problem does it solve?
8. De facto language for web is Javascript, but ... • Process of interpretation leads to time consuming process of parsing. • Profiling before JIT(Just In Time) compilation can add overhead. • Weakly typed and dynamic. • Not ideal for performance.
10. GO Go
11. • Performance Improvements • Faster startup times compared with JavaScript • Ability to use languages other than JavaScript in the browser • Portability What all problems does it solve?
12. Where Can we run WASM?
13. Will it replace Javascript? NOPE. • Designed to complement and run alongside JavaScript. • Load WebAssembly modules into a JavaScript app using the WebAssembly JavaScript APIs. • Advantage of WebAssembly's performance and power and JavaScript's expressiveness and flexibility.
14. WASM + GO support • In February 2017, the issue for WebAssembly support was opened. • In November 2017, Richard Musiol, author of GopherJS, made an announcement on implementation. • In August 2018, brand new support for WASM was release with Go 1.11 • Currently Experimental!!
15. GO’s journey to browser
16. Build to WASM go build -o main.go ./main.go Build for Current OS and architecture!! ./main.go
17. Building GO to WASM main.go main.wasm GOOS=js GOARCH=wasm go build -o main.wasm main.go
18. Enough Theory, Let’s look at the Demo!
20. Hello WASM! Get me fibonacci seres.
21. Loading WASM • The wasm_exec.js file. It's a JavaScript file provided by Go to load .wasm file into a Web page. • An HTML file loads the wasm_exec.js JavaScript and invokes it to fetch and execute the .wasm code into your browser. cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .
22. Loading WASM WebAssembly.instantiateStreaming() Object acts as the namespace for all WebAssembly related functionality. compiles and instantiates a WebAssembly module directly from a streamed underlying source.
23. Loading WASM // compiled module object // instantiated instance API for fetching network resources
24. Calling GO from JavaScript syscall/js - Experimental package - Was part of 1.11 - Should be used when working with browser APIs - Support Callbacks - Copies data
25. Glue code- syscall/JS can only exit when we want it to!!
26. A callable function
27. Interacting with DOM
28. Demo: Greyscale image filter • Used an algorithm to convert image to Greyscale using image library from GO. • Created a WASM file. • Some glue code. • Loaded into the browser.
30. When should we target web assembly?
31. • Heavily CPU-bound numbered computations. • Math heavy stuff like image manipulation, video manipulation, games etc). • When optimizing performance in existing JS apps, bottlenecks could be rewritten in a language that is better suited for the problem.
32. Conclusion • You can run GO code in browser • It’s a game changing technology • Currently experimental • Contribute to Go WASM
33. Thank you! @_ektagarg