Version: 2023.1
言語: 日本語
WebGLのキャッシュ動作
WebGL のオーディオ

WebGL グラフィックス

WebGL はウェブブラウザーでグラフィックスをレンダリングするための API で、OpenGL ES グラフィックスライブラリの機能にもとづいています。WebGL 1.0 は OpenGL ES 2.0 の機能とほぼ一致し、WebGL 2.0 は OpenGL ES 3.0 の機能とほぼ一致します。

カメラのクリア

デフォルトでは、Unity WebGL は各フレームの後に描画バッファをクリアします。つまり、フレームバッファのコンテンツは Camera.clearFlags の設定に関係なくクリアされます。ただし、インスタンス生成時にこの動作を変更することができます。これを行うには、WebGL テンプレートでwebglContextAttributes.preserveDrawingBuffertrueに設定します。

script.onload = () => {
       config['webglContextAttributes'] = {"preserveDrawingBuffer": true}; // Add this line to the index.html file in a WebGL Template
       createUnityInstance(canvas, config, (progress) => }

ディファードレンダリング

WebGL2.0 が使用可能な場合、Unity WebGL は ディファードレンダリングパス のみをサポートします。WebGL1.0 では、Unity WebGL ランタイムは フォワードレンダリング にフォールバックします。

グローバルイルミネーション

Unity WebGL は ベイクした GI のみをサポートします。リアルタイムグローバルイルミネーションは現在 WebGL ではサポートされていません。また、Unity WebGL は非指向性ライトマップのみをサポートしています。

リニアレンダリング

Unity WebGL は WebGL 2.0 で リニア色空間レンダリング のみをサポートします。リニア色空間レンダリングで WebGL 1.0 のフォールバックサポートはありません。リニア色空間レンダリングを使用して WebGL プレイヤーをビルドするには、Player 設定で WebGL 1.0 API を削除し、Other Settings パネルを開き、Automatic Graphics API 設定を無効にします。

一部のウェブブラウザーは sRGB DXT テクスチャ圧縮 をサポートしていません。これにより、すべての DXT テクスチャをランタイムに解凍するため、リニアレンダリングを使用するときにレンダリングパフォーマンスの品質が低下します。

ビデオクリップインポーター

VideoClipImporter を使用してビデオクリップを Unity プロジェクトにインポートすることはできません。初期アセットデータのダウンロードサイズが大きくなり、ネットワークストリーミングができなくなる可能性があるからです。動画の再生には、VideoPlayer コンポーネントの URL オプションを使用し、StreamingAssets/ ディレクトリにアセットを配置して、ブラウザのビルトインネットワークストリーミングを使用します。

WebGL シェーダーコードの制限

WebGL 1.0 仕様 は GLSLS シェーダーコードにいくつかの制限を課しています。これらの制限は多くの OpenGL ES 2.0 実装よりもより厳しいものです。これは多くの場合、独自のシェーダーを作成する場合に関わってきます。

WebGL には配列や行列のインデックス化に使用できる値に関して特定の制限があります。具体的には、WebGL の動的インデックスは、定数式、ループインデックス、または、それらの組み合わせのときみ可能です。頂点シェーダーの Uniform アクセスだけは例外で、どんな式を用いてもインデックスを使えます。

WebGL 1.0 に関するノート: WebGL 1.0 では、制御構造に追加の制限が適用され、while ループやほとんどのタイプの for ループは使用できません。しかしフィールドイニシャライザーが変数を定数に設定し、更新が変数に定数を追加または変数から定数を減算し、継続テストが変数と定数を比較するような for ループのカウントは可能です。

ノート: WebGL で使用可能なメモリには限りがあるため、不要なメモリ使用につながる不要なシェーダーバリアントを加えることは避ける必要があります。そのため、Unity では、シェーダーのバリアントシェーダーのストリッピング をよく理解し、バリエーションが多すぎるシェーダー (例えば Unity の スタンダードシェーダー) を Graphics Settings の [Always-included Shaders] section(class-GraphicsSettings#Always) に加えないように特に注意してください。

フォントレンダリング

Unity WebGL は他すべての Unity プラットフォームのようにダイナミックフォントレンダリングをサポートしています。ただし、ユーザーのマシンにインストールされているフォントにアクセスすることはできないため、使用するすべてのフォントは (多言語フォントに対応するフォントや、太字やイタリックのフォントの代替フォントも含めて) プロジェクトフォルダーに置き、代替として使うため、Font Names にリストする 必要があります。

アンチエイリアス

WebGL は、ブラウザーと GPU のほとんどすべて (ただし、すべてではない) の組み合わせでアンチエイリアスをサポートします。これを使用するには、WebGL プラットフォームのデフォルトの Quality 設定でアンチエイリアスを有効にする必要があります。

リフレクションプローブ

Unity WebGL はすべてのリフレクションプローブをサポートしています。ノート: WebGL 1.0 は Smooth リアルタイムリフレクションプローブをサポートしていません。

WebGL 2.0 のサポート

Unity には WebGL 2.0 API のサポートが含まれており、ウェブに対する OpenGL ES 3.0 レベルのレンダリング機能を提供します。

デフォルトでは、Unity WebGL ビルドは WebGL 2.0 API をサポートしています。これは WebGL Player 設定 > Other Settings パネルに移動し、Automatic Graphics API プロパティを無効にすると設定できます。

WebGL 2.0 をサポートするブラウザーには、次のような利点があります。

  • スタンダードシェーダーの内容は高品質です。
  • GPU インスタンシング と指向性ライトマップをサポートします。
  • シェーダーコードのインデックスやループに制限がありません。
  • パフォーマンスが良い。

ランタイムに SystemInfo.graphicsDeviceType を使用すると、Unity インスタンスが OpenGLES3 (WebGL2.0) と OpenGLES2 (WebGL1.0)、どちらでレンダリングしているかを判断できます。

その他の参考資料


  • WebGL 2.0 のリニアレンダリングは2017.2 で追加 NewIn20172
WebGLのキャッシュ動作
WebGL のオーディオ