top of page

トップ

採用情報

ニュース

サービス

TechFirmの強み

パートナー募集

会社情報

事例

資料請求

お問い合わせ

本サイトの利用条件

情報セキュリティ基本方針

個人情報保護方針

特定個人情報保護方針

トップ

採用情報

ニュース

サービス

TechFirmの強み

パートナー募集

会社情報

事例

資料請求

お問い合わせ

本サイトの利用条件

情報セキュリティ基本方針

個人情報保護方針

特定個人情報保護方針

WebAssemblyとは?Webを高速実行する最新技術のできること・できないこと、活用事例

  • 2023年10月31日
  • 読了時間: 8分

更新日:2月5日


今のインターネットではWebブラウザ上での情報収集だけでなく映像や音楽、ゲームなどのコンテンツを楽しめるようになりました。


そんな中、注目を集めている技術がWebAssemblyです。


本記事では、WebAssemblyがどのような技術で、どのようにビジネスへの活用ができるのかを解説します。また、すでにWebAssemblyを活用しているサービスについても紹介し、将来性についても考察しました。


WebAssemblyのメリットを理解したうえで、今後のビジネスに活用してください。


<目次>


WebAssemblyとは?Web上で高速実行可能な技術


WebAssemblyロゴ

WebAssemblyは、Webアプリケーションを高速実行するための最新技術で、プログラミング言語と多様な実行環境の間に位置する中間層的な役割です。「Wasm」と略されることもあります。 この技術が開発された背景には、Web上のコードの実行速度を高速化する目的がありました。WebAssemblyは高速にコードを実行できるため、高速処理の必要なブラウザ上のゲームや映像や画像などの重い処理にも利用されています。 Assemblyという名称から機械語に近い言語のイメージですが、WebAssemblyは直接記述するためのプログラミング言語ではありません。C、C++、Rust 等の多様な言語からコンパイルすることが可能なバイナリ形式で配布されるプログラムです。 コンパイルとは人間にとって理解しやすいコンピュータ言語から、機械が理解できる言語に一括変換すること。WebAssemblyの大きな特徴は、直接ソースコードとして記述する必要がないという点です。コンパイルすることで、初めて利用できる形になります。 近年、WebAssemblyがWebの現場だけでなく、インフラ技術として注目を浴びるようになってきました。どうしてWebAssemblyが注目されているのでしょうか。

C,C++,Rustファイル→WebブラウザにWebAssembly(コンパイルされた言語を実行する仕組み)+JavaScript /HTML/CSS

WebAssemblyが注目されている理由は利便性の高さ

WebAssemblyが注目されている最も大きな理由は利便性の高さです。具体的な利便性の高さについては、下記のとおり。

  •  WebAssemblyのバイトコードの形式が標準化されている

  • 多くのプログラミング言語からWebAssemblyにコンパイルできる

  • OSに依存せずに実行できる

  • 処理速度が速い

  • 安全性が高い

WebAssemblyはGoogle Chrome・Microsoft Edge・Safariなど多くのWebブラウザに対応しています。それは、OSに依存せずに実行でき、オープンスタンダードとして標準化されているからにほかなりません。 また、WebAssemblyはJavaScriptよりコンパクトであり、さらに機械コードに近いことから、高速処理に向いています。しかも、セキュリティ的にも安心です。 それでは、対応しているブラウザや言語とWebAssemblyの安全性について、もう少し詳しく解説しましょう。

WebAssemblyは安全性に優れている

WebAssemblyはセキュリティを重視して設計されているので、安全性に優れているのは当然です。具体的には、WebAssemblyではユーザーが通常利用する領域から隔離された空間に仮想環境(セキュリティ サンドボックス)を構築。したがって、元のネイティブ実装された API よりもセキュリティは向上します。 ただし、APIのセキュリティレベルが低い場合には、セキュリティレベルが制限されることはいうまでもありません。

対応ブラウザと対応言語

WebAssemblyは形式の標準化とOSに依存しないことから、多くのプログラミング言語に対応しています。2023年現在、対応している言語は下記の10種類です。

  • Java

  • PHP

  • C# .NET

  • C++

  • Ruby

  • C

  • Swift

  • R

  • Go

  • Rust

今後、さらに開発が進められ、対応言語は増えるでしょう。また、対応言語が多いため、多くのWebブラウザもWebAssemblyに対応しています。対応している一般的なブラウザは下記のとおりです。

  • Google Chrome・Chrome for Android

  • Microsoft Edge

  • Safari・iOS Safari

  • Firefox・Firefox for Android

  • Opera

  • Android Browser

現在、上記以外にも多くのブラウザが存在し、他にもWebAssemblyに対応しているブラウザがあります。対応ブラウザについても、今後さらに増えるでしょう。 多くの言語やブラウザに対応していることで、WebAssembly利用の可能性は広がります。それでは、WebAssemblyではどのようなことができるのでしょうか。


WebAssemblyで「できること」と「できないこと」

WebAssemblyは関数としてモジュール化したり、処理時間の短縮化をしたりと利便性が高い技術であることは事実です。しかしながらWebAssemblyは万能ではありません。多くのプログラミング言語に得意・不得意があるように、WebAssemblyにもできることとできないことがあります。 この章では、WebAssemblyで実現できること、できないことについて詳しく解説しましょう。

WebAssemblyでできること

WebAssemblyを利用する主な目的は、JavaScriptで書かれたコードの処理速度改善と開発コストの削減ではないでしょうか。 従来はJavaScriptによって記述され、Webブラウザで処理していた部分をWebAssemblyに置き換えることで、処理速度が改善されます。場合によっては5倍以上の処理速度が期待できますが、実測値の報告データによると約3倍でした。 また、ネイティブアプリケーションからWebアプリケーションへの移行も比較的容易となります。多くの場合、ネイティブアプリケーションとWebアプリケーションは異なる開発言語です。 しかし、WebAssemblyは多くの言語に対応しているため、言語による壁を取り払うことができます。結果的にWebAssemblyを利用することで、処理速度だけでなく開発時間も短縮可能です。

WebAssemblyでできないこと

WebAssemblyができない最も重要な項目が次の2点です。

  • システムのルート権限でアクセスできない

  • DOM操作ができない

WebAssemblyはOS やデバイス自体にシステムのルート権限でアクセスできません。したがって、USB や Bluetooth、画面などに直接アクセスすることは不可能です。 また、WebAssemblyはブラウザがHTMLを解析する際に生成するデータ構造であるDOM(Document Object Modelの略)の操作もできません。 WebAssemblyの設計仕様はHTMLの要素を操作するものではないため、DOMの操作にはJavaScriptを使う必要があります。WebAssemblyは利便性がありますが、単独では利用できません。 じつは、WebAssemblyは利便性の高さから、比較的身近なソフトウェアにも利用されています。あなたも知らず知らずの内にWebAssemblyを使用しているかもしれません。


WebAssemblyの活用事例3選

WebAssebmlyは下記のようなものに利用されています。

  • ビデオやオーディオの編集

  • Webブラウザでのゲーム

  • 科学分野での視覚化とシミュレーション

  • コンピュータゲームのエミュレーター

もう少し具体的な例を紹介しましょう。

Webデザインツール「Figma」は複数の人が同時に編集可能

WebAssemblyのリリース初期から採用しているサービスとしては、「Figma」が有名です。 FigmaはWebブラウザ上で簡単にWebデザインができるツールで、2016年にリリースされました。Webデザインツールとして他に有名なソフトといえば、Adobe XDやSketchですが、Figmaでも同様のことができます。 Figmaの大きな特長は複数の人でファイルを共有し、同時に編集できる点です。そのためにはWeb上での操作がポイントとなります。 FigmaはC++で作られているため、WebAssemblyに置き換えることは比較的容易でした。Figmaの開発においては、WebAssemblyがリリースされた直後に導入し、高速化を実現しています。 Figma公式サイトの発表では、「WebAssemblyに切り替えた後、ロード時間は3倍以上改善されました」とのこと。また、WebAssemblyを活用することで、ダウンロードサイズも自動的に改善されました。

Web版「Google Earth」はブラウザ間の違いを改善

Googleのサービスにおいても、WebAssemblyは活用されています。Web版「Google Earth」はWebAssemblyに移植され、Web上で利用できるベータ版として2019年6月にリリース。 従来のGoogle EarthはWeb版ではなく、ネイティブC++ベースのアプリケーションで、デスクトップにインストールするものでした。2005年の配布開始から、「まるで地球儀を回しているかのようだ」と人気を博したソフトです。 その後、2017年にはChromeブラウザ上で利用できるツールをリリースしています。ただし、WebAssemblyではなく、Googleのネイティブクライアント (NaCl)を使用していたため、Chromeブラウザ以外では利用できませんでした。 Google Earthにとってネックとなっていたのは、ブラウザ間の違いによるパフォーマンスへの影響です。しかし、WebAssemblyに移植したことでブラウザ間の違いは改善され、ユーザーも増加しました。 Googleの他のサービスでは、ビデオ会議に有用なGoogle Meetの背景をぼかす機能にもWebAssemblyが利用されています。

ゲーム開発環境「Unity」はブラウザ向けにビルド


Unity (ユニティ)は、誰でも簡単にオンライン上で2D・3Dのゲーム制作が楽しめるゲームエンジンです。個人であれば無料で使用でき、ゲーム以外にも建築業界、自動車業界やアニメーション業界でも使われています。 UnityはWindowsやmacOSを搭載したPCだけでなく、モバイルやWebブラウザ、家庭用ゲーム機といったクロスプラットフォームに対応している点が大きな特長です。

Unityが正式にWebAssemblyを採用したのは、Uniti 2018.1でした。それまでは実験的に実装されていましたが、バージョン2018.2において正式にWebAssemblyを採用。WebAssembly単独でのビルド作成機能が実装されることになります。 具体的には、Unityで作成したゲームやアプリケーションをブラウザ向けにビルドする部分をasm.jsからWebAssemblyに置き換えました。その結果、ブラウザ上でゲームやアプリケーションの動作がより安定しています。


WebAssemblyをこれからのビジネスに生かすには

本記事ではWebAssemblyがどのようなものか、具体的な活用事例とともに解説してきました。 WebAssemblyはプログラミング言語と多様な実行環境の間に位置する中間層的な役割を担うものであり、処理速度が速い点が大きなメリットです。また、WebAssemblyは多くのプログラミング言語に対応し、Google Chrome・Microsoft Edge・Safariなどの主要な主要なWebブラウザにも対応しています。 具体的な事例として、今回はFigma、Google Earth、Unityについて紹介しましたが、実際は他にも有名なWebサービスでWebAssemblyが活用されています。 WebAssemblyはWebブラウザ上での画像処理やゲームなどの高負荷処理には最適な技術です。しかも、利便性が高く、安全性も高いため、ビジネス展開にも期待が持てます。しかし、WebAssemblyは2017年に誕生した比較的新しい技術のため、まだまだ広く利用されているとは言い難い状況です。広く利用されていない主な原因としては下記の3点。

  • 標準化されていない

  • 開発環境が整っていない

  • マーケティングが下手

ただし、これらの課題は時間経過とともに解決していくでしょう。課題が解決できれば、今後のビジネス展開にも可能性が広がります。したがって、WebAssemblyはまだまだビジネスチャンスが大きく、今後はさらに普及していくことは間違いありません。


関連記事

Untitled.png

AI駆動開発:世界の先進企業に学ぶ事例9選

Untitled.png

システム運用保守のコスト削減ポイント

Untitled.png

オープンソースLLMまとめ:Llama 3.1/Tsuzumi/Falconなど

Untitled.png

WebVRとは?導入事例を交えてメリットや将来性を詳しく解説

Untitled.png

要件定義の進め方やポイントをわかりやすく解説

Untitled.png

要求定義とは?要件定義との違いや進め方を解説

発注者ガイドブック 全43P保存版 システム開発のせい成功確率を高める 無料の資料はこちらをクリック

人気記事TOP5

Trending

ビジネストレンド

100のファンクラブの会費とコンテンツを調査!今どきのアーティストファンクラブの会費相場とは?

テクノロジー

最新ARグラスまとめ|各種特徴や性能を徹底比較!

テクノロジー

「XREAL ONE」と「XREAL Air 2 Ultra」を実際に使ってみた──ARグラスの産業活用を見据えて

ビジネストレンド

【2026年1月〜6月開催】IT・DX関連の展示会まとめ

ビジネストレンド

オープンソースLLMまとめ:Llama 3.1/Tsuzumi/Falconなど

キーワード

Keywords

bottom of page