javascript - JavaScript タイマー スレッドの問題について

Question

実際にスムーズに動作するJavaScript MMORPGを始めています。現在、キャラクターを動かしたり、お互いにチャットしたり、お互いの動きをライブで見たりできることを証明するために、デモを作成しました。

http://set.rentfox.net/

現在、Javascriptタイマーは私があまり使用していないものですが、私が知っていることから、間違っている場合は修正してください。複数のsetIntervalsを同時に発生させると、実際にはうまく機能しないということですb / cすべてが単一のスレッド上にあります.

setInterval でスプライトの背景位置を指定して、モンスターに火の玉を放つ 10 人の人物が必要だとします。そのアニメーションでは、スプライトの背景位置のシフトのために DOM の再描画を行うために 10 の setIntervals が必要になります。それは大きなバギーではないでしょうか？

イベントキューを作成せずにすべてのアニメーションを同時に発生させ、タイマーについて心配する必要がないように、おそらくキャンバスを使用して、これらすべてを回避する方法があるかどうか疑問に思っていました。

それが理にかなっていることを願っています。さらに明確にする必要がある場合はお知らせください。

Answer 1

複数setIntervalの の問題は 2 つあります。1つ目は、ブラウザ上のすべてのJavascriptが（現在）シングルスレッドであるため、1つのタイマーの実行が次のタイマーの実行を遅らせる可能性があるためです。(ただし、ワーカー スレッドは来ています。Firefox には既にあります。Safari 4 [およびおそらく他のもの] と同様です。) 2 つ目は、タイマーが設定された間隔で発生することですが、その間隔が切れたときにハンドラーがまだ実行されている場合、2 つ目は、間隔は完全にスキップされます。たとえば、タイマーはそれ自体に干渉する可能性があります。

最後の部分にはさらに説明が必要です: setInterval が 10 ミリ秒であるとします (これは、どの実装でもそれを実行すると合理的に期待できる最速です。それより速くならないようにクランプされている可能性があります)。ハンドラーが 13 ミリ秒かかる場合、開始から 10 ミリ秒後に発生するはずだった間隔が完全にスキップされます。

普段はsetTimeoutこんな用途で使っています。ハンドラーがトリガーされたら、作業を行い、ハンドラーの最後で次のイベントをスケジュールします。それから（あなたが確信できる範囲内で）、その間隔で次のイベントが起こることを私は知っています.

あなたがしていることについては、単一の「パルス」タイマーが最適であるように思われ、パルスで行う必要があることは何でも処理します。実際のコードで見ているものに基づいて、そのパルスタイマーが使用するsetIntervalか、判断を求めるかどうか。setTimeout

Answer 2

TJ Crowderに+1、答えは完璧でした. ゲーム アニメーションには、DOM ノードよりも Canvas を使用する方法を学ぶことを強くお勧めします。後者は遅くてバグが多く、些細な状況ではブラウザーがハングアップします。OTOH、Canvas ははるかに高速で、ハードウェア アクセラレーションが可能で、必要に応じて 3D コンテキストを使用することもできます。