らんだむな記憶

blogというものを体験してみようか!的なー

ぷよぷよプログラミング

【公式】ぷよぷよeスポーツ×プログラミング

なんだってー。今時 SSL 対応してないだとー!ってのはさておきにして、なんだコレゎー。

う、ぐぬぬ・・・。初級コースの実装が終わって動かすと、横にした状態で落とすと何故かぷよが縦に戻る・・・。打ち間違いでないなら (※打ち間違いだった・・・1) 自分で勝手に実装を追加しなさいという課題・・・か?一応連鎖は発生する。この状況でも 3 連鎖くらいなら打てる。

“次のぷよ”を表示できるように改造するとかがこの後の自主課題になるのかなぁ。その前にちょっと中身をもう少し観察する:

window.addEventListener("load", () => {
    initialize();
    loop();
});

function loop() {
    ...
    requestAnimationFrame(loop);
}

が一番外側の大きなイベントループになってるんだな。Window.requestAnimationFrame() - Web API | MDNによると、

このメソッドは、いつでも画面上でアニメーションの更新準備が整った時に呼び出してください。これにより、ブラウザの次の再描画が実行される前にアニメーション関数が呼び出されることを要求します。このコールバックの回数は、たいてい毎秒 60 回ですが、一般的に多くのブラウザーでは W3C の勧告に従って、ディスプレイのリフレッシュレートに合わせて行われます。

ということなので、概ね 1/60 秒間隔で呼ばれるのであろうから、1 フレームごとにステータスをチェックして描画を更新しているということだな。但し、

Edge のバージョン17以前と Internet Explorer は、描画サイクルの前に requestAnimationFrame を確実に発行するとは限りません。

とか書いてあるので、ブラウザによってはあやしいと。どっかに Chrome 推奨とか書いてあったのはそのせいだな。きっと Edge はバージョン 17 あたりで Chromium ベースに移行したってことなんだろう。普段ゲームを書かないから知らんけどなかなか富豪的な実装だな。まぁでもそんなもんか。毎フレームごとに何か描画を更新するしな。1/60 秒でチェックから描画更新まで済むのか。凄いな。


  1. う〜ん、なんか stage.checkFall の辺がなんかおかしい??“ちぎり”の発動に違和感が・・・。でもここは課題の範囲ではないのだが・・・。と思ったが、「ぷよ」を回してみようのところで typo を仕込んでしまっていた・・・。そうか・・・こういう挙動になったりするのか・・・。