UGUIの理解と最適化



Ugui Understanding Optimization



この記事は、個人的な学習を収集して整理するだけです。

NGUIと比較して、UGUIの利点は次のとおりです。

  • 階層的管理
    • UGUIで使用される並べ替えは比較的単純であり、C ++レイヤーでより効率的です。
      • Canvas内の要素は、階層別に並べ替えられます。
      • ソート順または階層を介したCanvasピア間のソート
    • NGUIの順序は、深さ、Z値、およびRenderQueueの影響を受けます。全体的なルールは複雑すぎます。
  • 3DMeshの入れ子の問題 :キャラクターとパーティクルの効果とUIのネスト
    • UGUIは、パーティクルレンダラーの並べ替え順序を変更してUIで並べ替えます。
    • NGUIは、メッシュのRenderQueueMeshのレンダリングシーケンスを動的に変更し、それをUIPanelに追加できます。
    • RenderTextureを使用して他のUIで並べ替える
  • バッチロジック
    • NGUIは基本的に、メッシュレンダラーを使用してレンダリングされるカスタムメッシュを作成します。 C#レイヤーのUIのバッチ操作ロジック
    • UGUIはCanvasコンポーネントを定義し、レンダリングにCanvas Rendererを使用し、C ++レイヤーでバッチロジックを実行するため、UGUIはNGUIよりも動的レイヤーのパフォーマンスをより適切に処理します。
  • UIインタラクションイベント
    • UGUIは、Event&Raycastersデザインを使用して、NGUIのCollider&SendMessageを置き換えます
    • NGUIでは、Colliderを追加しない限り、デフォルトのコントロールはインタラクションに関与しません。
    • UGUIでは、インタラクションが手動で無効にされていない限り、デフォルトのコントロールはインタラクションに参加することです。
    • NGUIインタラクションイベントは、SendMessageを介してメッセージを送信することです。
    • UGUIは、より効率的なEventSystemの配布モードを採用しています
    • このような頻繁に呼び出されるメッセージをインタラクティブに入力するために、Delegateのパフォーマンスが大幅に向上します。直接的なフィードバックは、スクロールビューのスライドの滑らかさです。
  • アンカーポイント
    • UGUIは、任意のUI要素をアンカーポイントへの参照ポイントとして使用できます。考えられる問題は次のとおりです。タイミングの問題による複数のアンカーポイント、制御の「アンカーフライ」状況
    • UGUIのアンカー設計は親ノードに対してのみ実行でき、クロスレベルのアンカーポイントを実行することはできません。
  • UIアニメーション
    • NGUIは、ITweenを統合し、ITweenの使用をスクリプトにカプセル化します。これにより、さまざまな回転、平行移動、ズーム効果を簡単に作成でき、非常に使いやすくなります。
    • UGUIアニメーションの実装は、DoTweenを統合することで実現できます。 ITweenと比較すると、各フレームは時間がかからず、効率が高く、GCの生成も少なくなります。

UI制作の提案

アトラスの合理的な配布



アトラスを適切に割り当てると、ドローコールとリソースの読み込み速度が低下する可能性があります。詳細は次のとおりです。

  • 同じUIインターフェイス内の画像は、可能な限り1つの画像セットに配置されるため、ドローコールを可能な限り減らすことができます。
  • 共有画像は、一般的な弾丸ボックスやボタンなど、1つまたは複数の共有画像セットに配置されます。同じ機能の画像は、機器アイコンやヒーローアバターなどの画像セットに配置されます。これにより、切り替えの読み込み速度が低下する可能性があります。インターフェース。
  • さまざまな形式の画像は、透明(アルファあり)と不透明(アルファなし)など、さまざまな画像セットに配置されます。これにより、画像のストレージスペースとメモリ使用量を削減できます。 (UGUIのスプライトパッカーはこれを自動的に処理します)

CPUの最適化

一般に、CPUパフォーマンスを最適化するには、最初にプロファイラーを使用してパフォーマンスのホットスポットを見つけ、最も高価な関数を見つけてから、その消費を減らす方法を見つける必要があります。 CPUパフォーマンスのオーバーヘッドが高い主な理由の1つは、CanvasによるUIメッシュの再構築です。画像、テキストの有効化要素とUI要素、UIの長さ、幅、色など、Canvasによるメッシュの再構築をトリガーする多くの状況があります。待つ。 CanvasにUIメッシュの頂点が多い場合、アイテムのCPUオーバーヘッドは高くなります。 Unityのプロファイラーでは、対応するCanvas.SendWillRenderCanvasesまたはCanvas.BuildBatchに時間がかかりすぎます。



Canvas.BuildBatchの主な機能は、Canvasノードの下にあるすべてのUI要素のグリッドをマージすることです。マージされたグリッドはキャッシュされ、その下のUI要素のグリッドが変更された場合にのみ再結合されます。 UI要素のネットワーク変更は、主にCanvas.SendWillRenderCanvasesがレイアウトまたはグラフィックを呼び出して再構築するためです。この関数の呼び出しプロセスのタイミング図は次のとおりです。

image.png |左| 683x542

  1. このプロセスは、CanvasのWillRenderCanvases(上の画像の1)をリッスンしているCanvasUpdateRegistryによって実行され、主にレイアウトの再構築とダーティとしてマークされたくだらないものを実行します。レイアウトとグラフィックスが汚れている主な理由は、Canvasツリー構造の下のUI要素がGraphic.SetDirty(実際にはCanvasUpdateRegistry)と呼ばれる変更(たとえば、UIオブジェクト、UIノードの頂点、レコードサイズの変更など)されていることです。最終的に呼び出されます。)。RegisterCanvasElementForLayoutRebuild)。
  2. レイアウトを再構築する前に、レイアウト再構築キューの要素は、階層内の階層の深さ(上の図の2)に従って並べ替えられます。配置の結果、ルートに近いノードが優先されます。
  3. レイアウトを再構築し(上の図の3)、主にILayoutElementおよびILayoutControllerインターフェイスメソッドを実装して、場所、Rectサイズ、およびその他のレイアウト情報を計算します。
  4. Rebulidグラフィック(上の図の4)。主にUpdateGeometryを呼び出してグリッドの頂点データを再構築し(上の図の5)、UpdateMeterialを呼び出してCanvasRenderのマテリアル情報を更新します(上の図の6)。

上記のUGUIグリッド更新の原則に基づいて、次の最適化を行うことができます。



  1. できるだけ少ないUI要素を使用する UIを作成するときは、UIレベルを注意深く確認し、不要なUI要素を削除してください。これにより、深度の並べ替え時間(上図の2)と再構築時間(上図の3、4)を短縮できます。
  2. 動的分離、再構築の頻度を減らす 動的UI要素(頂点、アルファ、座標、サイズなどの頻繁に変更される要素)は、静的UI要素から分離され、特定のキャンバスに配置されます。
  3. UI要素の有効化と無効化を慎重に使用してください これらは時間のかかる再構築(図の3、4)をトリガーするため、代替手段の1つは、UI要素のCanvasrenderまたはCanvasを有効または無効にすることです。
  4. テキストの最適なオプションは注意して使用してください このオプションは、オーバーフレームなしでUIレイアウトに合わせてフォントサイズを動的に調整できますが、コストが非常に高くなりますが、Unityは、アトラスだけでなく、アトラスで使用される要素で使用されるすべてのフォントサイズを保存します。生成時間を追加すると、フォントに対応するアトラスも大きくなります。
  5. CanvasのPixelPerfectオプションは注意して使用してください このオプションにより、場所が変更されたときにui要素がレイアウトの再構築を引き起こします。 (たとえば、ScrollRectがスクロールするときに、CanvasのピクセルPerfectをオンにすると、Canvas.SendWillRenderCanvasの消費量が多くなります)
  6. キャッシュプールを使用して、ScrollViewにアイテムを保存します ビューから移動またはビューに移動された要素については、disableまたはenableを呼び出さずに、それらをキャッシュプールに配置するか、キャッシュプールから再利用を削除します。
  7. RaycastTargetを無効にする 再構築プロセスに加えて、UGUIのタッチ処理の消費も​​パフォーマンスのホットスポットになる可能性があります。 UGUIは、デフォルトで、表示されているすべてのグラフィックコンポーネントに対してレイキャストをオンにするためです。タッチイベントを受信する必要のないグラフィックの場合は、必ずレイキャストを無効にしてください。 unity5以降の場合、グラフィックスのRaycastTargetをオフにすることができます。 unity4.6の場合、タッチを受ける必要のないUI要素にCanvasgroupコンポーネントを追加できます。

GPUの最適化

一般に、GPUパフォーマンスのボトルネックには、2つの主な理由があります。複雑な頂点またはピクセルシェーダーの計算と、過剰なピクセルフィルを引き起こすオーバードローです。デフォルトでは、UGUIのすべてのUI要素はUI /デフォルトシェーダーを使用するため、最適化中にオーバードローの問題に優先順位を付けることができます。オーバードローは、主に多数のUI要素の重なりによって発生します。オーバードローの表示は比較的簡単です。シーンウィンドウでオーバードローモードを選択します。シーンが明るいほど、オーバードローは高くなります。

image.png |左| 628x404

オーバードローを減らすために、次の最適化を行うことができます。

  1. 非表示のUIを無効にする たとえば、システムを開いたときに別のシステムを完全にブロックした場合、ブロックされたシステムを無効にすることができます。
  2. 空の画像は使用しないでください Unityでは、raycastはタッチを検出するための基本要素としてグラフィックを使用し、空の画像を使用し、タッチイベントを受信するためにアルファを0に設定します。これにより、不要なオーバードローが作成されます。 >>空白のテキストまたはカスタムスクリプトで処理できます

もっと: