HTML5フレームワークにおける表示オブジェクトのパフォーマンス検証
-
clockmaker
- 22214
- 0
- 112
- 56
-
- いいね！56
池田 泰延 / ICS
@clockmaker
HTML5のフレームワークのパフォーマンスが気になったので、ちょっとしたベンチマークテストを作ってみました。まずは定番のCreateJSから。 http://t.co/voaQScx7d1 #html5jp
2013-04-10 00:56:15
池田 泰延 / ICS
@clockmaker
続いて DeNA さんの Arctic.js 。CreateJSと同じぐらいパフォーマンスがでてます http://t.co/tLcXd0Cfrk #html5jp
2013-04-10 00:58:20
池田 泰延 / ICS
@clockmaker
国内で注目を集めている enchant.js については CreateJS の半分くらいのパフォーマンス。ややがっかりなレベル。 http://t.co/AA6utBchlU #html5jp
2013-04-10 00:59:53
池田 泰延 / ICS
@clockmaker
念のためFlash (Starling) でも同じパフォーマンステストを試したらCreateJSの2倍以上のオブジェクトを表示しても余裕の60fps. http://t.co/OTOHvig49V #html5jp
2013-04-10 01:04:00
selflash
@selflash
@clockmaker 200個まで増やしましたが Arctic.jsが52FPS、CreateJSが41FPSくらいでした。 Win7+Chorome ver26.0.1410.43 m ですー。
2013-04-10 01:07:25
Ararara
@pakorepqu
@clockmaker 興味深い結果ですね！只今AIRからHTML5などへの移植を検討しておりましたのでとても参考になりました。 個人的に、enchant.jsは3Dもお手軽に扱えることが大きな利点だと思います。
2013-04-10 01:09:00
池田 泰延 / ICS
@clockmaker
さきほどのテストは何の最適化もしていない状態で、親子構造を使った場合、どのくらい多くのオブジェクトを表示できるか試してみたものです。それぞれのフレームワークに最適化オプションがあると思うので単純比較はできませんが。。ちかいうちにブログに検証結果をまとめたいと思います。
2013-04-10 01:09:54
池田 泰延 / ICS
@clockmaker
@selflash 情報ありがとうございます！ Arctic.js は構造がシンプルなので、CreateJSより計算負荷が少なくパフォーマンスが良かったのかもしれません。
2013-04-10 01:10:56
池田 泰延 / ICS
@clockmaker
@pakorepqu 確かにenchant.jsは物理演算や3Dが使いやすいように設計されているので、実際にどのフレームワークを使うかは目的に併せて選べばよいと思っていますー
2013-04-10 01:12:19
selflash
@selflash
@clockmaker フレームワークとして誰でも使いやすく汎用的にしようとすればする程、パフォーマンスとを天秤にかけないといけないのでフレームワーク作りって悩ましいですよね、、 ずっとCreateJSとenchant.jsを天秤にかけていたので凄く参考になりました！
2013-04-10 01:14:12
Ararara
@pakorepqu
@clockmaker いつもご返答ありがとうございます。どうやら私は池田さんのポストを見ると勉強意欲が掻き立てられるようです。 CreateJSはほとんど試したことがなかったので、また記事を参考にさせて頂きますね！
2013-04-10 01:16:09
池田 泰延 / ICS
@clockmaker
@sidestepism ご返信ありがとうございます。機能が充実している分、親子構造の計算で遅くなっている可能性がありますよね。私のほうでもいろいろ試してみます。
2013-04-10 01:41:07
あるてい
@rtsan
@clockmaker 現状のmasterブランチにおけるframe制御周りのbugfixが反映されていなくて34までしかでないようです。developのソースをビルドして実行してみたところ56fpsくらいになりました。
2013-04-10 01:41:49
あるてい
@rtsan
@clockmaker お手数おかけして申し訳ありません... パフォーマンステストについてですが、スケーリングも含むケースだとどう変わってくるのかちょっと気になります
2013-04-10 02:09:45
t.shinsay
@tshinsay
@clockmaker おはようございます！Starling比較してらっしゃったので、Pixi.jsのWebGLモードも比較してみると楽しいかもです！！
2013-04-10 07:09:23
池田 泰延 / ICS
@clockmaker
昨晩投稿した enchant.js のパフォーマンステストですが、最新のmasterブランチを使ったものに変更しました。 http://t.co/AA6utBchlU #html5jp
2013-04-10 20:09:34
池田 泰延 / ICS
@clockmaker
また比較用に Pixi.js のパフォーマンステストも作ったのでシェアします。他JSフレームワークとの比較のためにWebGLではなくCanvasRendererを使っています。 http://t.co/2BZ5aKtErN #html5jp
2013-04-10 20:11:48