なめらか卵のとろけるプリン

今日はおもに、Effectのなめらかさを向上させる方法を模索していました。

Effectはタイマードリブンです。タイマーから定期的なタイミングで呼ばれ式を評価し結果を描画します。
タイマーを細かく設定すれば理論上のなめらかさは向上しますが、実際にはブラウザの描画が追いつかずガクガクするだけで逆効果となります。

uupaa.js ver0.5までは、ブラウザの違いを区別せず、10msで駆動させていました。

もしかしてブラウザ毎にインターバルタイマーの最小値(分解能)は違うのではないか?

setIntervalの最小分解能を調べたところ、予想通りブラウザ毎に異なっていました。

この値を元に、V8とGeckoなら10msで、その他のブラウザは16msで駆動するように修正したところ、見た目のなめらかさが改善されました。

反省会

  • ベースクロック(最小分解能)に左右されないようにfpsを算出していたから、スムーズに修正できた。
    • 組込系に多いのが、「マイコンのベースクロックをまず決めてから、タイミングを刻むようにロジックを組む」から、こういう変更が入るとシステム全体が不安定になったり「それは時期的にも技術的にもできない」と会議室でパニックを起こす人がいるんだよね。
      • ハートマン軍曹にむかって「技術的に無理」とか口走ったら、そら恐ろしいことに(w