RareJob Tech Blog

レアジョブテクノロジーズのエンジニア・デザイナーによる技術ブログです

GoからWebAssemblyを動かしてみる

初登場コアテクノロジープラットフォーム部プラットフォームチーム所属の南です
すごい記事は先輩たちにお任せして、気になることをふわふわっと書こうと思います
最近は業務でGoを書いています(3ヶ月目)

今回はGo1.11から正式サポートされたWebAssemblyをさわりたいと思います

WebAssemblyとは

公式では

ネイティブに近いパフォーマンスで動作するコンパクトなバイナリー形式の低レベルなアセンブリ風言語です。C/C++ や Rust のような言語のコンパイル対象となって、それらの言語をウェブ上で実行することができます。WebAssembly は JavaScript と並行して動作するように設計されているため、両方を連携させることができます。

とのことです
要するに

  • Goのコードをブラウザ上で動かせる
  • コンパイルするので動作が速い
  • javascriptとの連携をさせられる(代替ではない)
  • 対応していないブラウザもある
  • wasmと呼ばれる

Hello, WebAssembly!

とりあえずみんな大好きHelloなんちゃらをやりたいと思います

$ mkdir wasm
$ cd wasm
$ touch main.go

main.goを作成し、以下のように記述します

package main

import (
    "fmt"
)

func main()  {
    fmt.Println("Hello, WebAssembly!")
}

Goファイルはこれだけです
WebAssemblyはhtmlとjsを用いて動作するので、それぞれ用意する必要があります
今回は公式さんが用意しているソースを使わせていただきます

$ curl -sO https://raw.githubusercontent.com/golang/go/master/misc/wasm/wasm_exec.html
$ curl -sO https://raw.githubusercontent.com/golang/go/master/misc/wasm/wasm_exec.js

go build

main.goをbuildします

$ GOOS=js GOARCH=wasm go build -o test.wasm

wasmを利用する場合は上記のようにGOOSとGOARCHを設定する必要があります
これでtest.wasmが作成され、htmlから読み込むことが可能になります

サーバ起動

今回は簡易的に動作を確認したいだけなのでgoexecを用いてGoのサーバを起動したいと思います

$ go get -u github.com/shurcooL/goexec
$ goexec 'http.ListenAndServe(":8888", http.FileServer(http.Dir(".")))'

動作確認

サーバまで起動したので実際にhttp://localhost:8888/wasm_exec.htmlをブラウザで開きます

f:id:nannannanan:20190704183843p:plain

これがRunボタンをクリックすると

f:id:nannannanan:20190704183948p:plain

コンソールにfmtの出力結果が表示されます
簡単ですね

まとめ

  • ブラウザ上でGoのプログラムを動かせるのはおもしろい
  • 公式さんが色々用意してくれてるので始めるのもかなり容易
  • 業務内で微妙に不便なこととかをささっとwasmで作って喜ばれる経験とかをしたい人生だった

という感じです
うまく使えると便利なツールを簡単に作れそうです
一緒にwasmとかGoを書いてくださる方いらっしゃればぜひご応募ください

サーバーサイドエンジニア(共通基盤) | アピール | 未来の教育を作る人のマガジン