AI活用の教科書
フロントエンド開発むずかしい3分で読了

WebAssembly

WebAssemblyうぇぶあせんぶり

ひとことで言うと

C言語やRustなどを変換し、ブラウザの中で高速に動かすための低レベルなバイナリ形式です。

📖 もうちょい詳しく

何が新しいの?

これまでブラウザの中で動くプログラムといえば、ほぼJavaScript一択でした。ただ、画像加工やゲーム、動画編集のような重い処理になると、JavaScriptでは速度が足りない場面が出てきます。WebAssembly(よく「Wasm」と略されます)は、そうした重い処理をブラウザの中でも速く動かすために生まれた、新しい形式です。

どうやって動いてるの?

WebAssemblyの正体は、人が読むための文字ではなく、機械が直接読み取りやすいバイナリ(0と1に近い形のデータ)です。C言語やRustといった言語で書いたプログラムを、この形式に変換(コンパイル)してから読み込ませます。ブラウザはそれを、ふだんのJavaScriptとは別の経路で素早く実行します。

何ができるの?

ブラウザだけで、画像や動画の編集、3Dゲーム、地図の描画といった重い処理がなめらかに動かせます。アプリをインストールしなくても、ページを開くだけで本格的な機能が使えるわけです。JavaScriptを置きかえるのではなく、重い部分だけをWebAssemblyに任せ、残りはJavaScriptが担う、という併用がよく使われます。

🌱 身近なたとえ

書類の翻訳で例えると、分かりやすいかもしれません。日本語の原稿(C言語やRustのコード)を、相手がすぐ読める言語にあらかじめ翻訳しておくのがコンパイルです。翻訳ずみの文書(WebAssembly)を渡せば、相手は辞書を引かずにさっと読めます。その場で言葉を選びながら話すJavaScriptに比べて、準備ずみのぶん速く処理が進む、というイメージです。

✅ まず覚えるポイント

  • ブラウザの中で動く、低レベルなバイナリ形式です
  • C言語やRustなどから変換(コンパイル)して作ります
  • 重い処理を、JavaScriptより速く動かせることが多いです
  • JavaScriptを置きかえず、併用して使うのが基本です
  • 画像加工・ゲーム・動画編集などの重い用途に向きます

🧭 よくある勘違い

JavaScriptはもう要らなくなるの?

そうではありません。WebAssemblyは画面の操作やボタンの反応などを自分だけで完結させる仕組みではなく、多くの場合JavaScriptから呼び出して使います。重い計算をWebAssemblyに任せ、画面まわりはJavaScriptが担う、という役割分担が一般的です。

人が手で書く言語なの?

ふつうは手書きしません。WebAssemblyは機械寄りの形式なので、C言語やRustなど読み書きしやすい言語で書いたものを、ツールで変換して作ります。読みやすいテキスト表現もありますが、開発者が日常的に直接打ち込むものではない、と考えるとちょうどよいです。

🧩 関連して覚えると楽な言葉

  • JavaScript: ブラウザの定番言語。WebAssemblyとセットで使うことが多い相棒
  • コンパイラ: 書いたコードをWebAssemblyの形式に変換する道具
  • ランタイム: 変換ずみのコードを実際に動かす実行環境
  • SPA: ページを切りかえず動かすWebアプリ。重い処理にWasmを使うことがある

🏁 ひとことでまとめ

重い処理だけを別の言語であらかじめ用意し、ブラウザの中で素早く走らせる——その仕組みがWebAssemblyです。