Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Goで作ったWebAssemblyで画像加工

 Goで作ったWebAssemblyで画像加工

Goで作成したGifアニメーションを作成するプログラムがWasmで動くかどうかを試した過程で学んだことをスライドにしました。

C123dee1909efd74244862379ec1e091?s=128

from-unknown

March 20, 2019
Tweet

More Decks by from-unknown

Other Decks in Technology

Transcript

  1. GoでWebAssembly @from_unknown

  2. アジェンダ • WebAssemblyとは ◦ 利点と制約 • GoでWebAssemblyをビルドする • ブラウザ上で実行するためには •

    気になるポイント ◦ 性能は? ◦ Goroutineは? • まとめ
  3. WebAssemblyとは • バイナリのインストラクションフォーマットである • 複数の言語で書くことができる ◦ C、C++、Rust、Go(次期バージョン正式対応)など • ネイティブに近い速度で実行できる •

    Javascriptを置き換えるのではなく、補完するものである • 主要ブラウザがWebAssemblyの1.0に対応されている
  4. WebAssemblyの利点 • 効率的で実行速度が早い • バイナリにコンパイルされるため、テキストのJavascriptよりサ イズが小さい • 既存のCやC++などの資産を活かせる

  5. WebAssemblyの制約 • サンドボックスの中で実行され、Javascriptと同様の制約を受 ける(Same-originなど) • 使用できるリソースの量は制限される • マルチスレッドやガーベージコレクションは現時点ではサポー トされていない •

    HTML内のDOMの操作を直接できない ◦ DOMの操作はJavascriptを介して操作する
  6. GoでWebAssemblyをビルドする Go and wasm: generating and executing wasm with Go

    https://blog.gopheracademy.com/advent-2017/go-wasm/ こちらも参考にしました サクッと Go → WebAssembly を試す https://qiita.com/cia_rana/items/bbb4112b480636ab9d87
  7. GoでWebAssemblyをビルドする 以下の方法でWebAssembly対応が入ったbetaを取得する • githubのgolang/goからソースを取得してビルドする ◦ 既にmasterにWebAssembly対応が入っている • githubのgolang/goのリリースからgo1.11betaXをダウンロー ドしてくる •

    公式のサブレポジトリにあるgo1.11betaXコマンドを使う
  8. GoでWebAssemblyをビルドする WebAssembly対応が入ったGoコマンドのGOOSとGOARCHに 以下を指定してビルドするだけ GOOS=js GOARCH=wasm go build … 簡単ですね!

  9. ブラウザ上で実行するためには • WebAssemblyをブラウザ上で実行するには、 WebAssembly.instantiate()に以下を渡す必要がある ◦ wasmファイル(ArrayBufferなどに読み込む必要あり) ◦ (Optional)importObject ▪ ここで渡したJavascriptのObjectがGo側から呼べる

    ※wasmファイルをArrayBufferなどにしなくても読み込める instantiateStreaming()が推奨されている様ですが、ブラウザサ ポートがマチマチの様です。
  10. ブラウザ上で実行するためには wasm形式にコンパイルしたGoを実行するには • Javascriptでwasmファイルを取得する • go/src/misc/wasm内の以下のソースが必要 ◦ wasm_exec.js • WebAssembly.instantiate()にwasmファイルとwasm_exec.js

    内のGo.importObjectを渡す ◦ wasm対応で追加されたsyscall/jsと連携している ◦ これのお陰でGo側からDOMの操作が出来る
  11. 気になるポイント • 性能は? • Goroutineは? デモ

  12. まとめ • GoでWebAssemblyは簡単に出来る • ただし、まだBeta版なので仕様が変わることもあり • wasm_exec.jsと連携することでJavascriptを実行することが 出来る • wasmにすることで何でも性能がよくなる訳ではない

    ◦ 軽い処理より重い処理に向いている • まだまだ発展途上なので今後に期待
  13. ご清聴ありがとうございました!