ランタイム UI のパフォーマンスに関する考慮点
このページでは、ランタイム UI のパフォーマンスを向上させる方法について説明します。
データストレージの最適化
usageHints を使って、ランタイムに要素がどのように使われるかを設定することができます。そうすれば、それに応じてデータストレージを最適化することができます。以下はその例です。
visualElement.usageHints = UsageHints.DynamicTransform;
以下の表は、どの要素にどのプロパティを使うかを、例を挙げて説明したものです。
| Elements with the following | Use this | Example |
|---|---|---|
| Frequent changes to their position or transform | UsageHint.DynamicTransform |
If you change style.left, style.top, or style.position for an element, set the UsageHint.DynamicTransform on that element. |
Many DynamicTransform child elements that often change positions or transforms |
UsageHint.GroupTransform |
In ShaderGraph, each node uses DynamicTransform, set UsageHint.GroupTransform on the view container. |
| A built-in style color being animated | UsageHint.DynamicColor |
If you change style.backgroundColor, style.unityBackgroundImageTintColor, or any border colors for an element, such as style.borderLeftColor, set the UsageHint.DynamicColor on that element. |
デバイスの能力を考慮する
一部の Android デバイスと WebGL は、インデックスバッファに部分的にパッチを適用できません。ユーザーがそのようなデバイスを使用している場合、または WebGL をターゲットにする場合、UI Toolkit のレンダリングは機能しますが、パフォーマンスが低下する可能性があります。パフォーマンスの低下を避けるには、同時にあまり多くの要素をアニメーション化せず、デバイスのプロファイリング を行います。
メッシュのテセレーションを避ける
ビジュアル要素のメッシュテッセレーションを作成するには、計算コストがかかります。要素のサイズ (幅/高さ) が変わるたびに、そのジオメトリは再作成されます。これは、アニメーションや頻繁なサイズ変更において問題となります。
一般的に言って、トランスフォーム とテクスチャは、柔軟性と再利用という点で良い選択ではありません。しかし、アニメーションを行う場合は、より良いパフォーマンスを得るために、以下を行ってください。
- 幅やその他のレイアウトプロパティの代わりに トランスフォーム を使用する。
- 角やコーナーを丸くする代わりに、テクスチャや 2D スプライトを使用する。
動的アトラスのテクスチャを制御する
テクスチャの変更によって壊れるバッチの数を減らし、良好なパフォーマンスを達成するには、アトラスを使用して、同時に使用されるテクスチャをグループ化します。これは以下のいずれかの方法で実現できます。
- スプライトアトラス を使う。この方法では、スプライトをより制御できますが、手動でスプライトアトラスを作成する必要があります。
- 動的アトラスを使用する。UI Toolkit は、ビジュアル要素からテクスチャが参照されると、自動的に動的アトラスにテクスチャを追加したり、削除したりします。
動的アトラスのテクスチャを検証する
動的アトラスを使用してテクスチャをグループ化する場合、ドローコール の回数を制限するために、テクスチャが動的アトラスに入ることを確認します。確認するには、フレームデバッガー を使います。フレームデバッガーは、テクスチャの変化を観察し、バッチが壊れるのを推測するのに役立ちます。
以下の例では、動的アトラスにランタイム UI のすべてのテクスチャが含まれていることを確認します。
ビルトインフィルターの適用
動的アトラステクスチャは、指定された最小サイズから開始し、必要に応じて水平または垂直方向に倍増し、指定された最大サイズまで拡大します。アトラスの最小サイズと最大サイズ は、Panel Settings アセットで定義できます。動的アトラスのフィルターを使って、サブテクスチャをアトラスに追加するかどうかを決めることもできます。
フィルターを有効または無効にするには、Panel Settings アセットの Inspector ウィンドウで、Dynamic Atlas Settings > Active Filters ドロップダウンリストからオプションを選択します。
カスタムフィルターの使用
カスタムフィルターをPanelSettings.dynamicAtlasSettings.customFilter に割り当て、グローバル、またはカスタムテクスチャ単位で、制限を加えたり緩めたりできます。
以下のカスタムフィルターの例は、大きなテクスチャに対しSize フィルターの適用を避け、一方、他のテクスチャに対して、Size フィルターをアクティブにしたままにします。
using UnityEngine;
using UnityEngine.UIElements;
class MyCustomFilter : MonoBehaviour
{
public PanelSettings panelSettings;
public Texture2D largeTexture;
void OnEnable() { panelSettings.dynamicAtlasSettings.customFilter = Filter; }
void OnDisable() { panelSettings.dynamicAtlasSettings.customFilter = null; }
bool Filter(Texture2D texture, ref DynamicAtlasFilters filtersToApply)
{
if (texture == largeTexture)
{
// Disable the Size check for this one.
filtersToApply &= ~DynamicAtlasFilters.Size;
}
return true;
}
}