🧠

Unity WebGL 負荷対策と最適化

に公開

WebGLメモリ対策概要

  • メモリが不足すると起動しない
  • 利用できるメモリは300MB程度が現実的な限度
  • メモリが不足した場合画像が乱れたり、動作が重くなる、止まるといった現象が起こる
  • 画像、音声等のリソースはアプリと違い全てオンメモリで展開されるため、リソースを減らす・減色・圧縮しても大きく劣化しないデザインとする
  • WebGL.data:こちらに全てのリソースが含まれているので、まずはdataの容量を削減すること
  • WebGL.wasm:ソースコードやライブラリ

参考リンク:

その他:

WebGLメモリ対策サウンド編

  • 1chしか無いサウンドは Force To Mono にチェック
  • Load Type: Compressed In Memory
  • Compression Format: Vorbis
  • Quality: 1
  • Sample Rate Setting: Optimize Sample Rate

参考: https://www.deathponta.com/entry/190304_unity_sound_compress

WebGLメモリ対策画像編

  • テクスチャは2の累乗(POT)サイズで作成する
  • 減色は必ずしておく
  • 画像はアトラス化してまとめる
  • 9スライスの利用(ダイアログの背景等は9スライスを積極的に使う)
  • Build Report Inspectorを活用して未使用のリソースが無いか、巨大なリソースが無いか確認する
  • 各画像に対して Max Size の設定を行う(デフォルトでは2048)
  • Mipmapは不要であれば作成しない

WebGLメモリ対策その他

  • WebGLでは任意のタイミングで GC.Collect() は使えない
  • シーン遷移時に Resources.UnloadUnusedAssets() を使用
  • UnityWebRequest 使用後は必ず Dispose() を行う
using (UnityWebRequest uwr = UnityWebRequest.Get(url)) {
    yield return uwr.SendWebRequest();
    if (uwr.isNetworkError) {
        Debug.Log(uwr.error);
    } else {
        var data = uwr.downloadHandler.data;
        var texture = ReadTexture(data);
        rawImage.texture = texture;
        rawImage.enabled = true;
        endAction?.Invoke();
    }
    uwr.Dispose();
    yield return Resources.UnloadUnusedAssets();
}
  • Build Settings: Code Optimization を Speed ではなく Size に
  • Managed Stripping Level を High に(Photon等は対象外)

ローディングが90%で止まる件の対策

対策 1/2

  • 数十秒ほど90%で止まることがある
  • HTML側で IndexedDB の削除機能を実装する
indexedDB.deleteDatabase("UnityCache");
  • Publishing Settings:
    • Compression Format: gzip
    • Decompression fallback にチェック

参考: https://note.com/ume_white/n/n5394255363f4

対策 2/2

  • iOS 15.4 の問題:Unity 2020.3.30f 以降を使用する
  • GenericMetadata.cpp に以下を追記
#pragma clang optimize off
...
#pragma clang optimize on
  • キャッシュの削除: <Project Root>/Library/Il2cppBuildCache/WebGL

参考:

その他

  • Photon Realtime および Photon RPC は WebGL でも動作する
  • サウンドはユーザーのアクションが無いと再生できない(ブラウザ仕様)
  • バックグラウンド再生はアプリ側で停止制御を行う
  • S3などのストレージを使う場合:
    • Content-Type: application/wasm
    • CloudFrontなどのCDN設定を推奨
ファースト・スクラッチTech Blog

Discussion