SpriteクラスをwebGL描画するphina.js用簡易プラグインです。
phina.gl2d.GLLayerクラスのインスタンスを生成し、そこにSpriteを追加するだけでOKです。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>phina.gl2d sample</title>
</head>
<body>
<script src='path/to/phina.js'></script>
<script src="path/to/phina-gl2d.js"></script>
<script type="text/javascript">
phina.define("MainScene", {
superClass: "phina.display.DisplayScene",
init: function(param) {
this.superInit(param);
this.glLayer = phina.gl2d.GLLayer(param).addChildTo(this); // <- here
this.player = Sprite('player').addChildTo(this.glLayer);
},
});
phina.main(function() {
var app = phina.game.GameApp({
assets: {
player: "./assets/player.png"
},
startLabel: 'main',
});
app.run();
});
</script>
</body>
</html>jsdelivrで配信してます https://cdn.jsdelivr.net/npm/phina-gl2d/dist/phina-gl2d.min.js
同じテクスチャ由来のSpriteクラスはバッジ処理してドローコールを節約するよう設計されています。
なので画像を一枚にまとめ（スプライトシート化）、スプライトが全て同じテクスチャ由来となるよう調整すると、最もパフォーマンスがよくなります。