スキップしてメインコンテンツへ

An Introduction to WebAssembly

2021年3月4日お知らせ

By Marco Fioretti

WebAssemblyとは一体何ですか?

WebAssembly、Wasmとも呼ばれますは、Webに最適化されたコード形式とAPI(Application Programming Interface)であり、Webサイトのパフォーマンスと機能を大幅に向上させることができます。 WebAssemblyのバージョン1.0は、2017年にリリースされ、2019年に公式のW3C標準になりました。

この標準は、明らかな理由から、すべての主要なブラウザサプライヤによって積極的にサポートされています。 「ブラウザ内」のユースケース とりわけ、ビデオ編集、3Dゲーム、仮想現実と拡張現実、p2pサービス、科学シミュレーションについて言及しています。この標準は、ブラウザをJavaScriptよりもはるかに強力にするだけでなく、Webサイトの寿命を延ばす可能性もあります。たとえば、WebAssemblyが インターネットアーカイブでのFlashアニメーションとゲーム.

WebAssemblyはブラウザだけのものではありません。現在、CloudflareWorkersなどの製品を使用してモバイルおよびエッジベースの環境で使用されています。

WebAssemblyのしくみ

.wasm形式のファイルには、共通スタックを使用する仮想マシンによって「ほぼCPUネイティブの速度」で実行可能な低レベルのバイナリ命令(バイトコード)が含まれています。コードはモジュール(ブラウザーによって直接実行可能なオブジェクト)にパッケージ化されており、各モジュールはWebページによって複数回インスタンス化できます。モジュール内で定義された関数は、1つの専用配列またはテーブルにリストされ、対応するデータは、arraybufferと呼ばれる別の構造体に含まれています。開発者は、Javascript WebAssembly.memory()呼び出しを使用して、.wasmコードにメモリを明示的に割り当てることができます。

学習とデバッグを大幅に簡素化できる.wasm形式の純粋なテキストバージョンも利用できます。ただし、WebAssemblyは、実際には人間が直接使用することを目的としたものではありません。技術的に言えば、.wasmは単なるブラウザ互換です コンパイル対象:ソフトウェアコンパイラが高級プログラミング言語で記述されたコードを自動的に翻訳できる形式。

この選択により、開発者は、すでに知っている言語(C / C ++、Python、Go、Rustなど)で、何十億もの人々の好みのユーザーインターフェイスを直接プログラミングできますが、以前はブラウザーで効率的に使用できませんでした。さらに良いことに、プログラマーは、少なくとも理論的には、WebAssemblyコードを直接見たり心配したりすることなく、これを取得できます(ターゲットは バーチャル マシン)どの物理CPUが実際にコードを実行するかについて。

しかし、私たちはすでにJavaScriptを持っています。本当にWebAssemblyが必要ですか?

はい、いくつかの理由があります。まず、バイナリ命令である.wasmファイルは、同等の機能を持つJavaScriptファイルよりもはるかに小さく、ダウンロードがはるかに高速です。とりわけ、ブラウザが内部仮想マシンで使用可能なバイトコードに変換する前に、Javascriptファイルを完全に解析および検証する必要があります。

代わりに、.wasmファイルを1回のパスで検証およびコンパイルできるため、「ストリーミングコンパイル」が可能になります。ブラウザーは、起動した瞬間にコンパイルと実行を開始できます。 それらをダウンロードする、ストリーミング映画の場合と同じように。

とはいえ、考えられるすべてのWebAssemblyアプリケーションが、エキスパートプログラマーによって手動で最適化された同等のJavaScriptアプリケーションよりも確実に高速または小型になるわけではありません。これは、たとえば、JavaScriptで必要とされないライブラリを含めるために.wasmが必要な場合に発生する可能性があります。

WebAssemblyはJavaScriptを時代遅れにしますか?

一言で言えば:いいえ。確かにしばらくの間は、少なくともブラウザ内ではそうではありません。 WebAssemblyモジュールは設計上ドキュメントオブジェクトモデル(DOM)にアクセスできないため、JavaScriptが必要です。 Webページを変更するために作成されたメインAPI。さらに、.wasmコードは、システムコールを実行したり、ブラウザのメモリを読み取ったりすることはできません。 WebAssemblyはサンドボックス内でのみ実行され、一般に、JavaScriptよりもさらに少なく、JavaScriptインターフェイスを介してのみ外界と対話できます。

したがって、少なくとも近い将来、.wasmモジュールは、JavaScriptを介して、その言語で記述された場合にはるかに多くの帯域幅、メモリ、またはCPU時間を消費する部分を提供するだけです。

WebブラウザがWebAssemblyを実行する方法

一般に、ブラウザーは動的アプリケーションを処理するために少なくとも2つの要素を必要とします。アプリコードを実行する仮想マシン(VM)と、そのコードがブラウザーの動作とWebページのコンテンツの両方を変更するために使用できる標準APIです。それが表示すること。

最新のブラウザ内のVMは、次の方法でJavaScriptとWebAssemblyの両方をサポートしています。

  1. ブラウザは、HTMLマークアップ言語で記述されたWebページをダウンロードし、レンダリングします
  2. そのHTMLがJavaScriptコードを呼び出すと、ブラウザのVMがそれを実行します。だが…
  3. そのJavaScriptコードにWebAssemblyモジュールのインスタンスが含まれている場合、そのインスタンスは上記のようにフェッチされ、必要に応じてWebAssemblyAPIを介してJavaScriptによって使用されます。
  4. そして、WebAssemblyコードがDOMを変更する何か(つまり「ホスト」Webページの構造)を生成すると、JavaScriptコードはそれを受け取り、実際の変更に進みます。

使用可能なWebAssemblyコードを作成するにはどうすればよいですか?

Wasmへの直接コンパイルをサポートしているプログラミング言語コミュニティはますます増えています。 入門ガイド 使用する言語に応じて、開始点としてwebassembly.orgから。すべてのプログラミング言語が同じレベルのWasmサポートを備えているわけではないため、マイレージが異なる場合があることに注意してください。 

今後数か月以内に、WebAssemblyに関する詳細情報を提供する一連の記事をリリースする予定です。自分で使い始めるには、The LinuxFoundationの無料版に登録できます。 Introduction to WebAssembly オンライントレーニングコース。

Linux Foundationのトレーニングと認定に関心をお寄せいただきありがとうございます。私たちは、中国のトレーニングサイトからより良いサービスを提供できると考えています。このサイトにアクセスするには、以下をクリックしてください。

Linux Foundationのカルチャに対するフィードバックは、より適切に、中国のカルチャウェブサイトに反映されることを期待しています。