レンダリングを複数のフレームに分散する

レンダリングの作業負荷を複数のフレームに分散させることで、1つのフレーム全体をレンダリングするために必要な作業量と時間を削減できます。

レンダリングのワークロードを分散するために、次のことができます。

プログレッシブレンダリングビューポート2Dノードを使用する

Progressive Rendering Viewport 2D ノードを使用して、レンダリングの作業負荷を複数のフレームに分散させ、1つのフレーム全体をレンダリングするために必要な作業量と時間を削減します。

Kanzi は、Progressive Rendering Viewport 2D ノードによってレンダリングされるすべてのコンテンツをnフレームごとに更新します。ここで、nは Progressive Rendering Viewport 2D ノードが使用するレンダーパスプレハブの子レンダーパスの数です。

例えば、Progressive Rendering Viewport 2D ノードが4つの子レンダーパスを持つ Group レンダーパスプレハブを使用する場合、Kanzi は Progressive Rendering Viewport 2D ノードがレンダリングするコンテンツを4フレームごとに更新します。Progressive Rendering Viewport 2D ノードを使用してインタラクティブなコンテンツをレンダリングする場合、そのようなコンテンツの応答性が低下する可能性があります。

複雑でレンダリング負荷の高いコンテンツを均等な部分に分割する場合、Progressive Rendering Viewport 2D ノードを使用してアプリケーションのレンダリングパフォーマンスを向上させることができます。

Progressive Rendering Viewport 2D では、Kanzi は1フレームで1つのレンダーパスをレンダリングします。フレームレートの変動を防ぐために、Progressive Rendering Viewport 2D ノードが使用するレンダーパス間でレンダリングを均等に分配します。レンダリングを均等に分配するには、各レンダーパスが次のようにレンダリングすることを確認してください。

  • ほぼ同じ量のポリゴン

  • 同様の複雑さを持つシェーダー

  • サイズが似ているテクスチャ

  • 同様の数のテクスチャ

例えば、異なる更新頻度でコンテンツをレンダリングするために、Progressive Rendering Viewport 2D ノードを使用します。コンテンツの一部を60 fpsで、残りを30 fpsでレンダリングするには、すべてのコンテンツを合わせて16 ms以下でレンダリングする必要があります(1000 ms / 60 fps = 16.6 ms)。60 fpsのコンテンツをレンダリングするのに最長で10 msかかる場合、残りのコンテンツを30 fpsで表示するには:

  1. 30 fpsでレンダリングしたいコンテンツを2つまたは3つの部分に分割し、それぞれの部分が6 ms以下でレンダリングされるようにします。

    60 fpsのコンテンツを毎フレーム60 fpsでレンダリングするには、60 fpsと30 fpsのコンテンツの合計レンダリング時間が16.6 msを超えてはなりません。

  2. Progressive Rendering Viewport 2D ノードを使用して、30 fps のコンテンツをレンダリングします。

    コンテンツを2つの部分に分割すると、Kanzi は30 fpsのコンテンツ全体を2フレームごとにレンダリングします。コンテンツを3つの部分に分割すると、Kanzi は30 fpsのコンテンツ全体を3フレームごとにレンダリングします。

../../_images/progressive-rendering-viewport-2d-different-rendering-frequencies.svg

ヒント

コンテンツを部分に分割する際、各部分のレンダリングにかかる時間を調べるには、

  1. Performance HUD を表示するには、次のいずれかを行います。

  2. レンダリングしたくないコンテンツを非表示にします。Node Tree の Kanzi Studio で、非表示にしたいノードを選択し、次のいずれかを行います。

    • Ctrl H を押してください。

    • Properties で、Node > Visible プロパティを追加して無効にします。

Progressive Rendering Viewport 2D ノードの使い方を学ぶには、チュートリアルを完了してください。チュートリアル: プログレッシブレンダリング を参照してください。

../../_images/progressive-rendering-completed.gif

Progressive Rendering Viewport 2D ノードを使用するには、

  1. Kanzi フィルタまたは Combine Object Source アイテムを使用して、レンダリングを複数のフレームに分散させたいノードを収集します。フィルタ と オブジェクトソース (Object Sources) を使用する を参照してください。

    例えば、Tag Filter を使用してノードを収集するには:

    1. Node Tree で、複数のフレームにわたってレンダリングしたいノードを選択します。Properties で、Tags プロパティを使用して、異なるレンダーパスでレンダリングするためのノードをマークします。タグの使用 を参照してください。

      たとえば、レンダリングを2つの部分に分割するには、

      1. 最初のレンダーパスでレンダリングしたいノードにタグ Pass 1 を付けてください。

      2. 2回目のレンダーパスでレンダリングしたいノードにタグ Pass 2 を付けてください。

    2. Library で、Alt を押しながら右クリック Rendering し、前のステップでノードにマークしたタグの数だけ Tag Filter フィルタを作成します。Properties で、Included Tags プロパティをその Tag Filter で収集したいタグに設定します。

      例えば、最初の Tag Filter フィルタを Tag Filter Pass 1 と名付け、Properties で Included Tags プロパティを Pass 1 に設定します。

      ../../_images/distibuting-rendering-filters.png ../../_images/tag-filter-pass-1.png
  2. Library > Rendering で Alt を押しながら右クリック Render Pass Prefabs を選択し、Progressive Rendering Viewport 2D ノードがコンテンツのレンダリングに使用する Group レンダーパスプレハブを作成します。

    ../../_images/create-group-render-pass.png
  3. Library で、前のステップで作成した Group レンダーパスを Alt を押しながら右クリック して、以下を作成します。

    1. Clear レンダーパス

    2. 最初のステップで作成したノードのコレクションごとに、Gather Lights レンダーパスと、その中の Draw Objects レンダーパス

    ../../_images/distributing-rendering-render-passes-in-library.png
  4. Library で、前のステップで作成した各 Draw Objects レンダーパスを選択します。Properties で、Object Source プロパティを、このレンダーパスでレンダリングしたいノードを収集するフィルタまたは Combine Object Source アイテムに設定します。

    例えば、最初の Draw Objects レンダーパスを選択し、Object Source プロパティを Tag Filter Pass 1 に設定します。

    ../../_images/draw-objects-render-pass-object-source.png
  5. Node Tree で、Progressive Rendering Viewport 2D ノードを作成します。Properties で、Render Pass Prefab プロパティを Group レンダーパスに設定します。

    Kanzi を設定して、Group レンダーパスプレハブを使用して Progressive Rendering Viewport 2D ノードをレンダリングします。

    ../../_images/render-pass-prefab-set-to-group-render-pass.png
  6. Node Tree で、最初のステップで収集したコンテンツを Progressive Rendering Viewport 2D ノードに追加します。

  7. Library の Clear レンダーパスで、Clear Color 0 プロパティを追加し、アルファチャンネルを含めて意味のあるカラー出力を生成するように設定します。

    ../../_images/clear-render-pass-with-clear-color-set.png

プログレッシブレンダリングでアニメーションを使用する

Progressive Rendering Viewport 2D ノード内のノードをアニメーション化するために、Animation Player またはステート遷移を使用することはできません。

プログレッシブレンダリングでアニメーションを使用するには:

  1. Node Tree で、アニメーションを使用したい Progressive Rendering Viewport 2D ノードを選択します。

  2. Properties で、使用したい Animation、Animation Clip、または Timeline Sequence に Timeline プロパティを設定します。

Progressive Rendering Viewport 2D ノードによってレンダリングされたコンテンツにアンチエイリアスを適用する

Progressive Rendering Viewport 2D ノードによってレンダリングされるコンテンツにアンチエイリアスを適用するには、Node Tree で Progressive Rendering Viewport 2D ノードを選択し、Properties で Multisample Level プロパティを追加し、使用したいアンチエイリアスサンプルの数に設定します。

Kanzi アプリケーションを実行したいデバイスのドキュメントを参照して、サポートされている値を確認してください。アンチエイリアスサンプルの数はデバイスに依存するためです。デバイスがサポートしていない値に Multisample Level プロパティを設定した場合、Kanzi Engine はその値をデバイスドライバがサポートする最大値にクランプします。

../../_images/progressive-rendering-viewport-2d-in-project-step-3.png ../../_images/progressive-rendering-multisample-level.png ../../_images/car-without-multisampling.png ../../_images/car-with-multisampling.png

Progressive Rendering Viewport 2D プロパティタイプとメッセージ

Progressive Rendering Viewport 2D ノードで利用可能なプロパティタイプとメッセージのリストについては、Progressive Rendering Viewport 2D を参照してください。

コンポジションターゲットのレンダリングの分散

フレームごとのレンダリング作業量を減らすために、Kanzi が Composition Target レンダーパスのコンポジションターゲットを更新するレートを設定できます。

コンポジションターゲットのレンダリングを分散するには:

  1. Library > Rendering > Render Pass Prefabs で、コンテンツをコンポジションターゲットにレンダリングするために使用する Composition Target レンダーパスを選択します。コンテンツを1つのコンポジションターゲットにレンダリングする、コンテンツを複数のコンポジションターゲットにレンダリングする、および テクスチャへのレンダリング (Rendering to texture) を参照してください。

    ../../_images/composition-target-render-pass-in-compose-and-blit-pass.png
  2. Properties に追加して設定します。

    • Render Pass > Update Rate を、Composition Target レンダーパスがレンダリングするコンテンツを更新するレートに設定します:

      • コンテンツを毎フレーム更新するには、1に設定します。これがデフォルトの値です。

      • コンテンツを隔フレームで更新するには、2に設定し、4フレームごとに更新するには、4に設定します。

      • コンテンツを一度だけレンダリングするには、0に設定します。

    • Render Pass > Update Rate Offset をレンダリングレートをオフセットしたいフレーム数に設定します。

      この方法により、複数のレンダーパスのレンダリングを異なるフレームに分散させることができます。

      例えば、コンテンツを1フレームおきに更新する Composition Target レンダーパスが2つある場合、そのうちの一方のレンダーパスで Update Rate Offset を1に設定します。これにより、Kanzi はそれらのレンダーパスがレンダリングするコンテンツを交互のフレームで更新します。

    ヒント

    同じレンダーパスプレハブを使用する複数の Viewport 2D ノードで Update Rate プロパティと Update Rate Offset プロパティを異なる値に設定するには、そのレンダーパスプレハブのインスタンスをカスタマイズできます。レンダーパスのインスタンスをカスタマイズする を参照してください。

    ../../_images/properties-update-rate.png

キューブマップ反射のレンダリングを分散する

フレームごとのレンダリング作業量を減らすために、Kanzi の更新頻度を設定できます。

  • Cubemap レンダーパスがレンダリングするコンテンツ。

  • Cubemap レンダーパスがコンテンツをレンダリングする先のキューブマップテクスチャの面。

キューブマップ反射のレンダリングを分散するために

  1. Library > Rendering > Render Pass Prefabs で、キューブマップ反射のレンダリングに使用する Cubemap レンダーパスを選択します。Cubemap レンダーパスを使用したキューブマップリフレクションの作成 を参照してください。

    ../../_images/cubemap-render-pass-in-library.png
  2. Properties に追加して設定します。

    • Render Pass > Update Rate を、Cubemap レンダーパスがレンダリングするコンテンツを更新するレートに設定します:

      • コンテンツを毎フレーム更新するには、1に設定します。これがデフォルトの値です。

      • コンテンツを隔フレームで更新するには、2に設定し、4フレームごとに更新するには、4に設定します。

      • コンテンツを一度だけレンダリングするには、0に設定します。

    • Face Update Rate を、Cubemap レンダーパスの Result Texture で1フレームに更新したいキューブマップの面の数に設定します。

      Result Texture には、Cubemap レンダーパスが自身とその子レンダーパスをレンダリングする先のキューブマップテクスチャが含まれます。

      デフォルトで、Kanzi は Update Rate プロパティで設定した速度で6つのキューブマップ面すべてを更新します。

      例えば、Face Update Rate を3に設定し、Update Rate を2に設定すると、Kanzi はこのレートでキューブマップの面を更新します。

      フレーム (Frame)

      キューブマップの面 (Cubemap faces)

      n

      +x、-x、+y

      n + 1

      -

      n + 2

      -y, +z, -z

      n + 3

      -

      n + 4

      +x、-x、+y

      n + 5

      -

      n + 6

      -y, +z, -z

      n + 7

      -

    • Render Pass > Update Rate Offset をレンダリングレートをオフセットしたいフレーム数に設定します。

      この方法により、複数のレンダーパスのレンダリングを異なるフレームに分散させることができます。

      例えば、Update Rate Offset を 1 に設定すると、Kanzi はフレーム n + 1 で最初のキューブマップフェイスを更新します。

    ../../_images/properties-cubemap-render-pass-update-rate.png

関連項目

チュートリアル: プログレッシブレンダリング

フィルタ

オブジェクトソース (Object Sources) を使用する

レンダリングのベストプラクティス

コンポジションターゲットへのコンテンツのレンダリング

キューブマップ反射の作成

Kanzi Studio レンダーパスプリセットを使用する