LoginSignup
1
0

More than 5 years have passed since last update.

Meshを継承したカスタムDisplayObjectを作る:Triangle(パフォーマンス計測編)

Last updated at Posted at 2016-05-24

カスタムDisplayObjectを作るやり方を覚えるためのTriangleクラス作成でしたが、使いどころがあるかもしれないので、その辺りの考察とパフォーマンス検証をしてみます。

えー、先に書きますとあまり役に立たない投稿内容となりました。

その1 Meshを継承したカスタムDisplayObjectを作る:Triangle
その2 Meshを継承したカスタムDisplayObjectを作る:Triangle(補足)

使い道

三角形のままだと、使える場面がかなり限られそう(抽象的なビジュアルのゲーム作成など?)ですが、三角形の中にも四角形部分が存在しますので、ここにテクスチャを適用することを考えます。これならば四角いDisplayObjectの代わりに使うことができそうです。

fig6.png
この、赤い部分だけにテクスチャを適用したいですが、頂点は3つしかなくこれ以上分割できない(しない)ので、いらない部分はテクスチャ側に透明部分をもたせることで解決します。テクスチャ適用が前提で、描画面積に無駄が出ますが。。

Triangle用テクスチャ(32x32)
スクリーンショット
実際に適用するテクスチャはこのようなものです。右下に黒い点が打ってありますが、これはTexturePackerなど設定で余白をトリムする機能をもっているパッキングツールを使うときに、そのトリムを抑制するためのものです。

Triangleは余白テクスチャにも対応していますが、左上部分の余白は良いものの、右下方向がトリムされてしまうと、実際にテクスチャを適用する際に、隣接している他のパーツが入り込んできてしまうので、このダミーの点が必要になります。

ピクセルシェーダーでなんとかするような手もあるかもしれませんが、まあ、とりあえず。

Quad用テクスチャ(16x16)
スクリーンショット
この下で、Quadと比較してのパフォーマスンス検証をします。Quad側にはこのテクスチャを使います。無駄な透明部分がなく大きさが4分の1です。どちらがパフォーマンスがいいでしょうか。

パフォーマンス計測用デモ

DemoCapture_2016_5_25_0_32_46.png DemoCapture_2016_5_25_0_33_30.png
テストはAIR書き出しで行っていますが、こちらにweb上で動くデモがあります。適当にボタンを押すとTriangleとQuadが作られます。デモのソースはここにあります。

DemoCapture_2016_5_25_0_34_3.png
テクスチャなしで表示すると(わかりやすく着色はしましたが)こんな感じになります。描画面積に違いがありますね。

計測

結論から言うと、ほとんどパフォーマンスの差はありませんでした。

スクリーンショット 2016-05-25 0.41.49.png

スクリーンショット 2016-05-25 0.41.39.png
Scountで見ると、5000個、1000個のDisplayObject切り替え時でともにこんな感じです。どちらがどちらだかわからない。

スクリーンショット 2016-05-25 0.42.30.png
グラフの青い部分がActionScriptの負荷なんですが、詳細を見ると、頂点データやインデックスデータのコピーに時間がかかっているようです。ちゃんと異なるデータが取れてるのか心配になりますが、GPUメモリをみてみると

スクリーンショット 2016-05-25 1.24.37.png
Triangle

スクリーンショット 2016-05-25 1.24.44.png
Quad

インデックスバッファーと頂点バッファーのメモリ量がそれっぽくなっているので、間違っていなそうです。

考察

結局DisplayObjectである限り、座標変換計算やデータの取りまとめに処理時間がかかり、ボトルネックになっているようですね。GPU側の処理の差が見えてこない。おおむね予想した通りではありますが。。

三角形ごとに1つのDisplayObjectとせず、たくさんの三角形を扱うDisplayObjectを作るとかなり速くなるのではないでしょうか。まあそれを汎用的にやっているのが、starling.display.MeshBatchクラスな訳ですが、使う用途を限定して、三角形以外のMeshを受けつけない・全体を拡大縮小回転させない、真面目にbounds計算しないなどの制限の元に処理の最適化を行うと、使えるものができそうです。
具体的な用途としてはシューティングゲームの弾幕とかですかね。(ほぼほぼパーティクルシステムぽい実装になる気もします。)

今回Traiangleクラス作成で得た知識も生きそうなので、そのうちやってみようと思います。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0