WebAssembly はモダンなウェブブラウザーで実行できる新しいタイプのコードです。ネイティブに近いパフォーマンスで動作するコンパクトなバイナリー形式の低レベルなアセンブリ風言語です。さらに、 C/C++ や Rust のような言語のコンパイル対象となって、それらの言語をウェブ上で実行することができます。 WebAssembly は JavaScript と並行して動作するように設計されているため、両方を連携させることができます。
概要
WebAssembly はウェブプラットフォームに大きな影響を与えます — 以前ではできなかったようなウェブ上で動作するクライアントアプリケーションのために、複数の言語で記述されたコードをウェブ上でネイティブに近いスピードで実行する方法を提供します。
WebAssembly は JavaScript を補完、並行して動作するように設計されています — WebAssembly JavaScript API を使用して、 WebAssembly モジュールを JavaScript アプリケーションにロードし、2 つの間で機能を共有できます。これにより、WebAssembly コードの記述方法を知らなくても、 WebAssembly のパフォーマンスとパワー、JavaScript の表現力と柔軟性を同じアプリケーションで活用できます。
さらに、W3C WebAssembly Working Group と Community Group を介して、ウェブ標準として開発されており、主要なブラウザーベンダーも積極的に参加しています。
ガイド
- WebAssembly のコンセプト
- まずは WebAssembly の高レベルなコンセプト— WebAssembly とはなにか、有用性、ウェブプラットフォーム (またはそれ以上) にどのように適合するか、どのように使用するか — の理解から始めてください。
- C/C++ から WebAssembly にコンパイルする
- C/C++ で書いたコードを Emscripten のようなツールを使って .wasm にコンパイルできます。どのように動作するか確認してみましょう。
- 既存の C モジュール から WebAssembly へのコンパイル
- WebAssembly のコアユースケースは、既存のCライブラリのエコシステムを利用し、開発者が Web 上でそれらを使用できるようにすることです。
- Rust から WebAssembly へのコンパイル
- Rust コードを書いていれば、WebAssembly にコンパイルすることができます！このチュートリアルでは、Rust プロジェクトをコンパイルして既存の Web アプリケーションで使用するために知っておく必要があるすべてのことを説明します。
- WebAssembly コードのロードと実行
- .wasm を手に入れたら、この記事では、Fetch または XHR API と WebAssembly JavaScript API を組み合わせて、フェッチコンパイル、インスタンス化する方法について説明します。
- WebAssembly JavaScript API を使用する
- .wasm モジュールをロードしたら、それを使いたいでしょう。この記事では、WebAssembly JavaScript API を用いて WebAssembly を使用する方法を説明します。
- エクスポートされた WebAssembly 関数
- エクスポートされた WebAssembly 関数は、WebAssembly 関数の JavaScript リフレクションであり、JavaScript から WebAssembly コードを呼び出すことができます。 この記事では、それらが何なのか説明します。
- WebAssembly テキストフォーマットを理解する
- この記事では wasm テキスト形式について説明します。これは .wasm モジュールの低レベルなテキスト表現で、デバッグ時にブラウザーの開発者ツールに表示されます。
- WebAssembly テキストフォーマットから wasm に変換する
- この記事では、テキスト形式で書かれた WebAssembly モジュールを .wasm バイナリに変換する方法について説明します。
API リファレンス
WebAssembly- このオブジェクトは、 WebAssembly に関連する全ての機能の名前空間として振る舞います。
WebAssembly.Global()WebAssembly.Globalオブジェクトは JavaScript と1つ以上のWebAssembly.Moduleインスタンス(のインポート/エクスポート可能な値)を横断してアクセスできるグローバル変数のインスタンスを表現します。これによって、複数モジュールでの動的リンクを実現できます。WebAssembly.Module()WebAssembly.Moduleオブジェクトにはブラウザーでコンパイルされたステートレスな WebAssembly コードが含まれており、効率的に Worker で共有したり、IndexedDB にキャッシュしたり、複数回インスタンス化したりすることができます。WebAssembly.Instance()WebAssembly.Instanceオブジェクトはステートフルで、実行可能なModuleのインスタンスです。Instanceオブジェクトには JavaScript から WebAssembly コードを呼び出すことを許可されたエクスポートされた WebAssembly 関数が含まれます。WebAssembly.instantiateStreaming()WebAssembly.instantiate()関数は WebAssembly コードをコンパイル、インスタンス化するための主要な API で、Moduleと、その最初のInstanceを返します。WebAssembly.Memory()WebAssembly.Memoryオブジェクトはリサイズ可能なArrayBufferで、Instanceからアクセスされる生のバイト列を保持します。WebAssembly.Table()WebAssembly.TableオブジェクトはInstanceからアクセスされる関数参照などの不透明値のリサイズ可能な型付き配列です。WebAssembly.CompileError()- WebAssembly
CompileErrorオブジェクトを生成します。 WebAssembly.LinkError()- WebAssembly
LinkErrorオブジェクトを生成します。 WebAssembly.RuntimeError()- WebAssembly
RuntimeErrorオブジェクトを生成します。
例
- WASMSobel
- 他の多くの例については webassembly-examples レポジトリーを参照してください。
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| WebAssembly JavaScript Interface | 草案 | JavaScript API の初回ドラフト定義。 |
ブラウザーの互換性
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
Update compatibility data on GitHub
| デスクトップ | モバイル | サーバー | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
WebAssembly | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
CompileError | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
Global | Chrome 完全対応 69 | Edge 未対応 なし | Firefox 完全対応 62 | IE 未対応 なし | Opera 未対応 なし | Safari 完全対応 13.1 | WebView Android 完全対応 69 | Chrome Android 完全対応 69 | Firefox Android 完全対応 62 | Opera Android 未対応 なし | Safari iOS 完全対応 13.4 | Samsung Internet Android 完全対応 10.0 | nodejs 未対応 なし |
Instance | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
LinkError | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
Memory | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
Module | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
RuntimeError | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
Table | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
compile | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
compileStreaming | Chrome 完全対応 61 | Edge 完全対応 16 | Firefox 完全対応 58 | IE 未対応 なし | Opera 完全対応 47 | Safari 未対応 なし | WebView Android 完全対応 61 | Chrome Android 完全対応 61 | Firefox Android 完全対応 58 | Opera Android 完全対応 45 | Safari iOS 未対応 なし | Samsung Internet Android 完全対応 8.0 | nodejs 未対応 なし |
instantiate | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
instantiateStreaming | Chrome 完全対応 61 | Edge 完全対応 16 | Firefox 完全対応 58 | IE 未対応 なし | Opera 完全対応 47 | Safari 未対応 なし | WebView Android 完全対応 61 | Chrome Android 完全対応 61 | Firefox Android 完全対応 58 | Opera Android 完全対応 45 | Safari iOS 未対応 なし | Samsung Internet Android 完全対応 8.0 | nodejs 未対応 なし |
validate | Chrome 完全対応 57 | Edge 完全対応 16 | Firefox
完全対応
52
| IE 未対応 なし | Opera 完全対応 44 | Safari 完全対応 11 | WebView Android 完全対応 57 | Chrome Android 完全対応 57 | Firefox Android
完全対応
52
| Opera Android 完全対応 43 | Safari iOS 完全対応 11 | Samsung Internet Android 完全対応 7.0 | nodejs 完全対応 8.0.0 |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応
- 実装ノートを参照してください。
- 実装ノートを参照してください。