1

私は大学のプロジェクト用に複数の発射体シミュレーターに取り組んでおり、HTML5 キャンバスへの JavaScript レンダリングのタイミングを最適に設定する方法を知りたいと思っています。

私は物理学にオイラー積分器のセットアップを使用しており、このプロジェクトでは精度が非常に重要です。レンダリングは非常に基本的なものです

私の質問は、これらすべてのタイミングを最適に設定する方法です。

今私は持っています：

  • 固定時間ステップで setTimeout() を使用してループする関数で実行される物理およびその他のロジック
  • requestAnimationFrame() 呼び出しを使用してループする別の関数でのレンダリング (柔軟な時間ステップ)

これらの 2 つのループは、ある程度同時に実行されます (JavaScript は、Web ワーカーなしでは実際にはスレッドをサポートしていないことを知っています)。私の言いたいことがわかるなら、物理シミュレーションです。

ここで物理的精度が最も重要であるとすれば、どのようにタイミング システムを設定することをお勧めしますか? (ここでは Web Worker を使用すると便利かもしれませんが、他のエンジンでこれが使用されているのを見たことがありません)

ありがとう！

4

2 に答える 2

2

実際に実行していない限り、「マルチスレッド」を試みないことをお勧めします。また、その場合でも、必ずしもお勧めしません。

すべての同期を維持する最善の方法は、実行スレッドを 1 つにすることです。setTimeout私のゲームでは、約33ミリ秒の単一ループで問題なく動作するようです。

また、少なくとも私の経験では、はまたはsetTimeoutよりもはるかに美的な体験を提供します。では、フレームが遅れて配信されると、Javascript は「追いつく」のが難しくなり、アニメーション フレームの一貫性が失われます。では、ゲームをスムーズに実行するためにフレームがスキップされますが、これは実際には事態を難しくします。setIntervalrequestAnimationFramesetIntervalrequestAnimationFrame

于 2012-11-05T14:22:19.757 に答える
1

1 つの方法は、物理処理の間隔を設定し、x フレームごとに 1 回、すべてをレンダリングすることです。

var physicsTime;
var renderFrequency;
var frameCount;

setInterval(function(){updateStuff()},physicsTime);

次に updateStuff() で

function updateStuff(){
  frameCount ++;
  if (frameCount >= renderFrequency){
    frameCount -= renderFrequency;
    render();
  }
  physics();
}
于 2012-11-05T14:12:45.177 に答える