アクションゲームやパズルゲーム、シューティングゲームの当たり判定など様々なところで使われるのが物理エンジンです。各プラットフォームごとにエンジンが開発されていますが、今回はHTML5/JavaScriptに注目して紹介します。
Box2DJS
有名な物理エンジンであるBox2DをJavaScriptにポーティングしたエンジンになります。若干昔のエンジンで、prototype.jsに依存しています。ただ、IECanvasを使えばレガシーなIEにも対応できるのが利点です。
Box2DJS - Physics Engine for JavaScript
LiquidFun
Googleが開発した流体をシミュレートできる物理エンジンです。ベースはBox2Dになります。C++、JavaそしてJavaScriptに対応しています。
https://www.youtube.com/watch?v=yXLmdu810BQ
Matter.js
スマートフォンでの動作も考慮された軽量な物理エンジンです。Canvasでのレンダリングに加えて、WebGLによるレンダリングもサポートしています。ブラウザはIE8以上からサポートしています。
スマートフォン向けには軽量であることに加えて、タッチイベントやレスポンシブへの対応も行われています。スローモーションにしたり、逆にスピードアップすることもできます。
Matter.js - a 2D rigid body JavaScript physics engine
Physijs
three.jsに対応した3D物理エンジンです。デスクトップであってもパワーをかなり使います。ジェンガのデモは良くできていて一度体験して欲しいと思います。
Physijs - a physics plugin for threejs
box2dweb
Box2DFlash 2.1aをJavaScriptに移植したエンジンです。2011年くらいからアップデートされていませんが、今でも動作します。
box2dweb - Box2DFlash port to javascript - Google Project Hosting
ammo.js
Bulletという有名な物理エンジンをEmscriptenを使ってJavaScriptに変換したライブラリになります。WebGLを使っているので大量のオブジェクトもスムーズに書き出せるようになっています。
cannon.js
上記ammo.jsにインスパイアされた3D物理エンジンです。ammo.jsと同じくBulletをJavaScriptに変換したエンジンになります。Three.jsとの親和性が高いようです。
いかがでしょうか。JavaScriptでも高いパフォーマンスで出力できるのが分かるかと思います。デスクトップはもちろん、スマートフォンにおいても当たり判定が必要なゲームなどで使うと良さそうです。
Webブラウザで遊んでできたデータの保存はぜひニフティクラウド mobile backendを使ってください!