1's and 0's: Golang and WebAssembly - Guus van Weelden, Loodse

1's and 0's: Golang and WebAssembly - Guus van Weelden, Loodse

Transcript

1. 1's and 0's: Go and WebAssembly GoDays Berlin, 30th January ‘19 Guus van Weelden Loodse GmbH @guusvw91
2. Guus van Weelden 00. Guus van Weelden guus := Speaker{ Name: "Guus van Weelden", Positions: {"Developer", "Consultant"}, Employer: "Loodse GmbH", Age: 27, Likes: {"Go", "K8s", "American Football"}, Origin: "Hamburg, Germany", Twitter: "@guusvw91", } guus.Talk(“1\'s and 0\'s: Go and WebAssembly”) $ go run guus.go
3. Today’s (glorious) agenda. WebAssembly? Go 1.11 Go & WASM - Past, Present & Future Demo Time Metas Questions?
4. 02 Much slides, Some live coding, Cool Memes, Let’s Go!
5. WebAssembly? Why should I care, I’m a damn backend/ops guy! WebAssembly?
6. 01 WebAssembly is a binary instruction format for a stack-based virtual machine. WASM is designed as a portable target for compilation of high-level languages like C/C++/Rust/Go, enabling deployment on the web for client and server applications. WebAssembly WebAssembly?
7. WebAssembly?
8. WebAssembly is a binary instruction format... WebAssembly?
9. { binary instruction format ➔ Less file size ➔ Faster execution WebAssembly?
10. … WASM is designed as a portable target for compilation of high-level languages like Go ... WebAssembly?
11. { portable target of high-level languages ➔ Use languages you already know ➔ Stuff like type-safety WebAssembly?
12. … enabling deployment on the web for client and server applications. WebAssembly?
13. { enabling deployment on client and server apps ➔ Enables for a shared code base, so less deployment WebAssembly?
14. WebAssembly’s Values WebAssembly? • Efficiency • Standardization • Security/Sandboxed • More Languages
15. Need more motivation?
16. WebAssembly?
17. WebAssembly? Go code Go
18. 24th of August ‘18 The release of Go1.11
19. { Go 1.11 • Getting rid of GOPATH • Getting Modules support • many changes & improvements to the toolchain, runtime, and libraries • WebAssembly support • ... Go 1.11
20. { Go 1.11 • Getting rid of GOPATH • Getting Modules support • many changes & improvements to the toolchain, runtime, and libraries • WebAssembly support • ... Go 1.11
21. We’re getting native WASM support! Yeah! Go 1.11
22. Go 1.11
23. Go 1.11
24. Go 1.11 • compile to one WebAssembly module • resulting size is at minimum around 2 MB • Go programs can call into JavaScript • new experimental syscall/js package • new GOOS value "js" and GOARCH value "wasm"
25. Go & WASM - Past, Present & Future
26. But wasn’t there something called GopherJS?! Go & WASM - Past, Present & Future
27. Yes. But it compiles Go ONLY(!) to JS. Go & WASM - Past, Present & Future
28. Current Limitations Go & WASM - Past, Present & Future • No native DOM APIs (yet - OS lib is out there) • No multithreading (yet) • Large binary file sizes • Performance not yet where it should be • Some core libraries are not supported ◦ Parts of the net-package =( ◦ ...
29. import "syscall/js" Go & WASM - Past, Present & Future package js Package js gives access to the WebAssembly host environment when using the js/wasm architecture. Its API is based on JavaScript semantics. This package is EXPERIMENTAL. Its current scope is only to allow tests to run, but not yet to provide a comprehensive API for users. It is exempt from the Go compatibility promise. $ godoc syscall/js | head -n 12
30. Its API is based on JavaScript semantics.
31. import "syscall/js" Go & WASM - Past, Present & Future js.Global(), js.Null(), js.Undefined(), js.ValueOf() Values Value.Get(), Value.Set(), Value.Call(), Value.New() Objects
32. import "syscall/js" Go & WASM - Past, Present & Future Value.Invoke() Functions Value.Bool(), Value.Float(), Value.Int(), Value.String() Transformations from JS Value to Go type
33. import "syscall/js" Go & WASM - Past, Present & Future TypedArray, Index(), SetIndex() Arrays NewEventCallback(flags EventCallbackFlag, fn func(event Value)) Callback Callbacks
34. import "syscall/js" Go & WASM - Past, Present & Future | Go | JavaScript | | ---------------------- | ---------------------- | | js.Value | [its value] | | js.TypedArray | typed array | | js.Callback | function | | nil | null | | bool | boolean | | integers and floats | number | | string | string | | []interface{} | new array | | map[string]interface{} | new object | js.ValueOf()
35. Sample Code Go & WASM - Past, Present & Future import ( "log" "syscall/js" ) func main() { var cb js.Callback cb = js.NewCallback(func(args []js.Value) { log.Println("button clicked") }) js.Global().Get("document").Call("getElementById", "myButton").Call("addEventListener", "click", cb) } $ GOARCH=wasm GOOS=js go build ./cmd/wasm
36. Go & WASM - Past, Present & Future
37. { How to start? • Writing some Go code • Writing some HTML code • Copying js-glue files • Compile to wasm • Serve the files
38. Writing some Go code package main import "fmt" func main() { fmt.Println("Hello, WebAssembly!") }
39. Writing some HTML code <html> <head> <meta charset="utf-8"> <script src="wasm_exec.js"></script> <script> const go = new Go(); WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => { go.run(result.instance); }); </script> </head> <body></body> </html>
40. $ GOOS=js GOARCH=wasm go build -o main.wasm $ cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" . $ goexec 'http.ListenAndServe(":8081", http.FileServer(http.Dir(".")))' • Copying js-glue files • Compile to wasm • Serve the files
41. Kelsey Hightower Praise the demo gods!
42. Upcoming - Past, Present & Future • Go WASM frameworks • Package-level caching • Native Browser APIs • Threading, Garbage Collection (?) • Continual improvements
43. • github.com/dave/wasmgo ◦ CLI to compile Go to WASM & serve it locally or upload it • github.com/gopherjs/vecty ◦ Vecty is a React-like library for GopherJS -> currently working on WASM support • Grpcweb.jbrandhorst.com ◦ GopherJS gRPC-Web Client -> currently working on WASM support Go & WASM - Past, Present & Future
44. One last thing!
45. Any Questions?
46. Didn’t you missed anything?
47. Yeah, a cute cat gif!
48. Recommendations Metas • Today - joining the PARTY! • Container Days ‘19 • Support your local Go community
49. Container Days Metas
50. Thanks to... Metas • Matthias Loibl (@MetalMatze) - First Go & WASM hacking • Jason Murray (@chaosaffe) - Title of the talk • Markus Zimmermann (@markus_zm) - stole some ideas & slides from him • The great team of the GoDays(@godaysio) for organizing this event
51. 03 Thanks for listening & attending enjoy the rest of the conference. The end