長い間、私はJSをゲーム開発のプラットフォームとして真剣に考えていませんでした。 インタプリタ言語であり、JSの速度は遅いです。 しかし最近では、私のお気に入りのTweenLiteアニメーションフレームワークがJSに移植されました。 これに加えて、著者は現在のJSフレームワークのパフォーマンスを示すテストケースを作成しました。
TweenLite JSが優れたFPSを生成したため、非常に興味深いものになりました。 そして、FlashとJSフレームワークを比較するために同じ例を書くことにしました。
さらに、これらの例のFPSをさまざまなブラウザーとさまざまなOSで比較することは興味深いことでした。
テスト自体は、動きのアニメーションであり、写真のサイズを変更します。これを使用して、写真の数を変更できます。 Flashのテストケースはこちら 、サンプルのソースコードはこちらです。
テストは古いHP Compaq 625ラップトップで行われました。
鉄
AMD Turion IIデュアルコアP520(2.3 GHz)、2 GB RAM、ATI Radeon HD 4200。
オペレーティングシステム :
Windows 7 x32、Linux Mint 13 x32
ブラウザーとFlash Player :
Google Chrome 21.0.1180(Flash Player 11.3.31)、FireFox 15.0.1(Windows用Flash Player 11.4.402、Linux用FP 11.2.202)、Interrnet Explorer 9.0.8112(Flash Player 11.4.402)
Linux上のAdobeの公式サポートは既に終了しているため、Firefox上のFlash PlayerはOSごとに異なるバージョンでインストールされたと言いたいのですが、ブランチ11.2のセキュリティアップデートのみが利用可能になります。 Firefoxとは異なり、Google Chromeでは、Flash PlayerはPepper APIプラグイン用の新しいクロスプラットフォームAPIを介して動作するため、最新バージョンに更新されます。
それで、何が起こったのか見てみましょう:
テスト番号1:
1秒あたりのフレーム数(Chrome 21.0.1180、Flash Player 11.3.31、Windows 7 x32) | ||||||||||
フレームワーク\テスト | TweenLite(AS) | トゥイナー(AS) | GTween(AS) | jQuery(JS) | TweenLite(JS) | YUI3(JS) | MooTools(JS) | 道場(JS) | TweenJS(JS) | Zepto(JS) |
500 | 60 | 60 | 60 | 16 | 60 | 6 | 12 | 22 | 17 | 47 |
1000 | 60 | 41 | 60 | 1 | 51 | 1 | 5 | 5 | 2 | 28 |
3000 | 21 | 6 | 19 | 1 | 16 | 1 | 1 | 1 | 1 | 5 |

ここでは、500、1000、および3000千枚の写真に対して3つのテストが実行されました。 3000フレームのFlashフレームワークとTweenLite JSの大きなマージンを見るとわかるように、Flash tweenerさえも追い越しました。 Zeptoは自分自身をよく見せましたが、誰もが気に入っているアニメーション用のjQueryは非常に貧弱です。 このようなペースで開発が続けば、JSにはFlashにふさわしい代替品になる可能性がすべてあると結論付けることができます。
さらに、さまざまなブラウザやさまざまなオペレーティングシステムでパフォーマンスがどのように変動するかに興味を持ちました。 結局のところ、フラッシュプレーヤーは1人のカンターによって開発されており、パフォーマンスに大きな違いはないはずです。 また、JSエンジンは個々のブラウザーごとに、まったく異なる人々によって作成されます(自転車効果)。 それでは結果を見てみましょう。

ご覧のとおり、Flashプレーヤーは同じですが、ブラウザによって動作が異なりますが、これはブラウザと対話するときに異なるAPIを使用するためです。 最も失敗したFPプラグインはInternet Explorer用でした。
JavaScriptブラウザーエンジンのパフォーマンステストを見てみましょう。 ここでは、3000で多くのフレームワークがフリーズするため、テストは500枚の写真で実行されました。

Google Chromeが最速であることが判明しました。これは、Googleが投資する金額によって異なりますが、驚くことではありません。 さらにFirefoxでは、新しいインクリメンタルガベージコレクターの導入により状況が変わる可能性があります 。 最初と最後のギャップは非常に大きいです。 あなたがJSでゲームを書いて、それがChrome、Firefoxでうまく機能していると想像してください。しかし、その後誰かがIEから来ました、あなたは次に何が起こるか想像できます、IEはハングし、おそらくそれに陥ります、そしてそれで多くのタブを開きます。 その結果、ユーザーはサイトをブラックリストに追加します。 フラッシュゲームがあった場合、これは起こりませんでした。
さまざまなブラウザでのFlash Playerのパフォーマンスには大きな違いがあるため、同じブラウザのさまざまなオペレーティングシステムで Flash Playerがどのように変化するかを見てみましょう。

悲しい画像ですが、Linuxの小規模な分布を考慮して、AdobeはこのOSでプレーヤーを最適化することを怠っています。 Firefoxの結果は投稿しません。FlashPlayer 11.4と11.2を比較するのは不公平だと思いますが、実際には違いは2倍ではありません。
さらに進んで、JSエンジンは異なるOSでどのように動作しますか?


ご覧のとおり、Chromeはほぼ同じですが、喜ぶことはできますが、Firefoxでは、Linuxバージョンが著しく遅れています。
結論:
JavaScriptのパフォーマンスが向上していることがわかるように、それは良いことです。 しかし、まだ多くの問題があります:- すべてのブラウザでゲームがどのように動作するかをテストする必要があり、新しいIEのリリースにより、何も落ちないことを神は禁じます。
- ブラウザのパフォーマンスの違いは不快な効果をもたらします;一部のゲームでは、ゲームが他のゲームに飛びついて速度が低下します。
- 非常に難読化しない限り、ソースコードを非表示にすることはできません。
JavaScriptでゲームのクライアント部分を開発するとき、他にどのような問題が待ち受けていますか?