Google Earth をウェブに展開する方法

WebAssembly で Google Earth へのブラウザ間のアクセスを改善

テクノロジーに関係なく、開発者が構築するすべてのアプリケーションをブラウザで利用できれば理想的です。しかし、プロジェクトをウェブに導入することには障壁があります。そのテクノロジーは、構築に使用されたテクノロジーと、そのテクノロジーがさまざまなブラウザ ベンダーによってどれだけサポートされているかによって異なります。WebAssembly(Wasm)は W3C で標準化されたコンパイル ターゲットであり、ウェブ上の JavaScript 以外の言語からコードベースを実行できるようにすることで、この問題の解決に役立っています。

それが Google Earth で実現したのです。WebAssembly のプレビュー ベータ版で現在利用可能になっています。ただし、この機能は Google Earth のベータ版であり、スムーズに処理できない場合があります(通常の Earth for web をお試しください)。このベータ版は、Chrome やその他の Chromium ベースのブラウザ(Edge(Canary バージョン)、Opera、Firefox など)でお試しいただけます。プラットフォーム固有のアプリケーションのクロスブラウザ サポートを改善したいとお考えの方は、このベータ版をぜひご活用ください。

Google Earth 向け WebAssembly を選んだ理由

Google Earth はもともと C++ で記述されていたのは、インストールを目的としたデスクトップ アプリケーションだったからです。その後、スマートフォンが普及するにつれ Android と iOS に移植し、NDKObjective-C++ を使用して C++ コードベースの大部分を保持できました。2017 年に Earth をウェブに導入したとき、Google はネイティブ クライアント(NaCl)を使用して C++ コードをコンパイルし、Chrome ブラウザで実行しました。

当時、NaCl は C++ コードをブラウザに移植して、Earth で必要なパフォーマンスを提供できる唯一のブラウザ技術でした。残念なことに、NaCl は Chrome 専用の技術であり、ブラウザをまたいで採用されることはありませんでした。今度は WebAssembly に切り替えています。これにより、同じコードを使用してブラウザ間で実行できます。これにより、ウェブ上でより多くの人々が Earth を使用できるようになります。

エッフェル塔が表示された地球のスクリーンショット

スレッド表示に関するスレッド

WebAssembly は標準として進化し続けており、ブラウザはより多くの機能を追加して拡張されています。Earth の観点から見ると、ブラウザ間での WebAssembly のサポートで最も大きな違いはスレッドのサポートです。マルチスレッドをサポートしているブラウザとサポートしていないブラウザがあります。地球は、現実世界の巨大な 3D ビデオゲームのようなものです。そのため、常にデータをブラウザにストリーミングして解凍し、画面にレンダリングする準備をしています。この作業をバックグラウンド スレッドで行えるようになったことで、ブラウザにおける Google Earth のパフォーマンスが明らかに向上しています。

マルチスレッドの WebAssembly は、ShareArrayBuffer と呼ばれるブラウザ機能に依存しています。これは、Spectre と Meltdown のセキュリティ脆弱性が明らかになった後に、ブラウザから取得されました。攻撃による潜在的な損害を軽減するため、Chrome のセキュリティ チームは、すべてのデスクトップ オペレーティング システムに Chrome にサイト分離を導入しました。サイト分離により、各レンダラ プロセスは 1 つのサイトのドキュメントのみに制限されます。このセキュリティ機能が導入された結果、Chrome でパソコン版 SharedArrayBuffer が再度有効になり、Chrome for Chrome でマルチスレッドの WebAssembly を使用できるようになりました。

他のブラウザでは、SharedArrayBuffer を再度有効にするためにサイト分離またはその他の緩和策に取り組んでいます。当面の間、これらのブラウザでは Google Earth はシングルスレッドで動作します。

各ブラウザで WebAssembly が動作する仕組み

Google は、Earth を移植するブラウザでの WebAssembly のサポートの状態について多くのことを学びました。WebAssembly を使用してアプリケーションを開発する場合、WebAssembly が各ブラウザでどのように機能するかの現状を理解することが重要です。

エッジ

Edge は、Microsoft が EdgeHTML レンダラから Chromium ベースのレンダラに移行するという 2 種類の開発エクスペリエンスになりつつあります。現時点では、WebAssembly 向け Google Earth ベータ版は WebGL2 に対応していないため、現在の公開バージョンの Edge では動作しません。この問題は、Chromium をベースにした新しいバージョンの Edge が近日中にリリースされた時点で修正される予定です。それまでの間、Edge の Canary 版をダウンロードして、Earth が正常に動作することをご確認ください。

Chrome

Chrome は、デスクトップでのマルチスレッド処理など、WebAssembly を強力にサポートしているため、結果として Earth がよりスムーズに動作します。Chrome では、WebAssembly でマルチスレッドによる動的なメモリ割り当てをサポートする予定です。それまでは、メモリ容量が限られているデバイス(32 ビットマシンなど)で Google Earth を起動できない可能性があります。

Firefox

Firefox は WebAssembly は適切にサポートしていますが、マルチスレッドはサポートしていません。そのため、Google Earth の表示速度が遅くなる可能性があります。私たちは、Mozilla が今後のバージョンでマルチスレッド対応を取り戻すことを楽しみにしています。良い点として、Firefox は動的なメモリ割り当てをサポートしています。

オペラ

Opera は、Chrome と同じく Chromium をベースとしており、今後の Edge バージョンが登場します。ただし、現在のバージョンの Opera では、WebAssembly はシングル スレッドでのみサポートされています。Earth は Opera でも動作しますが、操作性が多少低下します。新しいバージョンの Opera は、マルチスレッドに対応し、より堅牢な WebAssembly をサポートすることを期待しています。

Safari

Safari には WebAssembly が強力に実装されていますが、WebGL2 を完全にサポートすることはできません。そのため、WebAssembly を含む Earth は Safari では動作しません。具体的には、一部のシェーダーで GLSL 1.2 が必須となります。WebGL2 のサポートが追加されると、Safari でも Earth をご利用いただけるようになることを願っております。

WebAssembly 機能の導入が進んでいる

Google Earth をウェブで公開するまでには、長い道のりを歩んできました。約 6 年前、Google は最初の asm.js ベースの内部デモを開始しました。このデモは何年にもわたって維持、拡張されていました。WebAssembly が W3C で採用された標準になったため、この WebAssembly ビルドは Earth の WebAssembly ビルドに変換されました。

WebAssembly や Earth にはまだ道があります。具体的には、Emscripten(C++ コードから WebAssembly を生成するためのツールチェーン)を使用して LLVM バックエンドに移動します。この変更により、今後の SIMD サポートや、ソース言語コードのソースマップなどのデバッグツールが強化されます。その他に、OffscreenCanvas の採用や、WebAssembly での動的メモリ割り当ての完全サポートなどが期待されています。しかし、Google は正しい方向に向かって進んでいると認識しています。WebAssembly は、ウェブ上の Earth の長期的な未来を担うものです。

こちらのベータ版をぜひお試しください。Earth で直接フィードバックをお寄せください。