スマホの低電力モードだとpixi.jsのFPSが半分になる問題を無理やり解決する
この記事の続き
頂いたコメントによると、FPSが単純に半分になったりとかだけではないらしい。
FPSが中途半端な数字(単純な60の倍数以外)でもなんとか上手く動いているように見せたい。
script.js
let app = new PIXI.Application();
/*この辺をどうにかしたらしっかり解決しそうなんだけどなあ
app.ticker.speed = 1;
app.ticker.maxFPS = 30;
app.ticker.minFPS = 30;
*/
document.getElementById("game").appendChild(app.renderer.view);//domに貼り付け
app.ticker.add(loop);//ループ処理追加
let time = 0;
let txt = new PIXI.Text(time, {fill:0xFFFFFF});//経過時間(1/60s)を表示するテキスト
app.stage.addChild(fps);
function loop(delta){
time += 1*delta;//FPSが端末に依らないように「見せる」処理
txt.text = time;
}
delta
はtickerの中で使える変数で、前のフレームからの経過時間(1/60s)が実数で代入されている。
例えばスクリプト中のように、time
は本来ならフレームごとに1増えて然るべきだが、1*delta
を増やすことで60FPSを達成しているように見せかけることができる。
ただしあくまでも「見せかけ」なので、実際に1秒間に60回計算が行われるとは限らない。
どんな環境でも一律でFPSを30にしたりする方法があればいいんだけどなあ。
ticker.speed
, ticker.maxFPS
, ticker.minFPS
あたりを上手いことやればいい感じになりそうな気がしているが、このやり方だとどうしても環境によって差異が生じる。