Safari および Apple Vision Pro における WebGL のパフォーマンス
Safari—特に iOS では—は、3D ウェブ開発において常にパフォーマンスチェレンジの最高峰とされてきました。 WebKit の独自のパフォーマンス特性と組み合わさった Metal ベースの WebGL 実装は、特に扱うのが興味深いものです。
この記事では、Safari 上での WebGL アプリのパフォーマンスを向上させる方法についての洞察を提供します。
Apple Vision Pro
最近では、Apple Vision Pro の発売に伴い、Safari 上での WebGL パフォーマンスがますます重要なものとなっています。Apple Vision の Safari バージョンは、MacOS および iOS の Safari のすべてのパフォーマンス特性を継承しています。
近々 Apple Vision Pro 上での WebXR についての詳細な記事を投稿する予定です。ニュースレターに登録して通知を受け取ってください。
Apple Vision Pro での Wonderland Engine
もしすでに Wonderland Engine を使用しているのであれば、朗報です：0.9.0 リリース で行った最適化がすべて Apple Vision Pro にも適用されます。
Apple Vision Pro にアクセスできる開発者たちは、Wonderland Engine ベースのアプリで素晴らしいパフォーマンスを報告しています：
Safari 向けの最適化
別のフレームワークを使用している場合は、ぜひ私たちの WebGL パフォーマンスプロファイリングのブログ記事をチェックしてください。そのブログ記事には、最適化すべきアプリケーションのボトルネックを見つけるためのヒントが含まれています。
さらに、Safari でプロファイリングする際に見つかる可能性のあることについてのメモを以下に示します。これらがすべてのケースで適用されるわけではありません。プロファイルを作成して、どれが問題を引き起こす原因なのかを見極めてください。
ボトルネック
Safari で WebGL を扱う際に遭遇する可能性のある特有の問題を以下に示します：
ユニフォームバッファ
Apple のグラフィックス API Metal が WebGL と異なるため、Safari は内部で WebGL 形式のユニフォームバッファをエミュレートする必要があります。このエミュレーションにより、UBO のパフォーマンスを予測するのが難しくなります。ある利用方法では問題ない場合もありますが、データをアップロードするタイミングを誤ると最大 150ms のハッチが発生することがあります。
Metal 実装の Angle（WebKit が WebGL2 API の実装に使用している）からのこのコードスニペットは、WebGL の bufferSubDataの GLES 相当の実装を指しています。このことは、ブラウザ開発者が一貫したグラフィックス API を提供するためにどれほどの努力をしているかを理解するのに役立ちます。また、ブラウザのパフォーマンスを理解し最適化するために、Wonderland Engine チームがどれだけの努力を払っているかを示しています。
Safari が WebGL2 のサポートを長らくリリースしないことに多くの不満がありました。サポートしないのではないかとの推測に反して、2021年9月に Safari 15 で WebGL2 サポートがリリースされました。WebKit および Angle のコードを読むと、それが簡単な作業ではなかった理由に対しての共感が生まれるかもしれません。
WebGL ステートアクセス
WebGL の getParameter 関数には、いくつかのパフォーマンスにおける驚きがあります。一見無害なこの関数は、多くのパフォーマンス予算を消費する可能性があります。
WebGL エラー
エラーを getError で確認するのは一般的に良い考えですが、フレームコールバック外では避けるべきです。必要以上に高価な場合があります。
メモリと制限
WebGL Safari は、テクスチャサイズ、レイヤー、ユニフォームバッファサイズなどの制限を報告します。これらの制限を確認するための優れたツールは webglreport.com です。
理論上、Safari はこれらの制限までの割り当てを許可しますが、これがページのクラッシュを引き起こすことがあるかもしれません。
iOS 上でメモリリソースをより効率的に使用するために、Wonderland Engine は Texture Streaming という機能を提供しています。これは、現在フレームで必要なものに基づいてテクスチャの部分を動的にメモリ内外でスワップする機能です。デフォルトで有効になっています。
終わりに
間もなく、Apple Vision Pro 上での WebXR に関する詳細なブログ記事を公開する予定です。ニュースレターに登録して、リリース時に通知を受け取ってください。
それまでの間、ぜひ Wonderland Engine をお試しください。特に Unity からの移行では、Wonderland Engine は 学びやすいです。
ぜひ Discord サーバーに参加してください。開始するためのリソースの紹介を喜んで行います。