JavascriptのタイマーをsetTimeoutより正確に作成する方法はありますか？

質問

ずっと気になっていたのは、"left "セクションの中にある setTimeout() メソッドが予測できないことです。

私の経験では、タイマは多くの状況で恐ろしく不正確です。不正確というのは、実際の遅延時間が 250～500ms 多かれ少なかれ異なるということです。これは大きな時間ではありませんが、UI 要素を隠したり表示したりするためにそれを使用する場合、その時間は目に見えて顕著になることがあります。

を確実に実行するためにできるトリックはありますか。 setTimeout() が正確に実行されるようにするために、（外部 API に頼ることなく）何かコツがあるのでしょうか。それとも、これは失われた原因なのでしょうか。

どのように解決するのですか？

以下のようなトリックがありますか？ を確実にするために setTimeout() が が正確に実行されるようにするために、（外部APIに頼ることなく 外部APIに頼ることなく）正確に実行できるようにするか、それともこれは迷走しているのでしょうか？

いいえ、そうではありません。完全に正確なタイマーに近いものは setTimeout() - ブラウザはそのためにセットアップされているのではありません。 しかし のように、タイミングをとるためにそれに依存する必要はありません。ほとんどのアニメーションライブラリは、何年も前にこのことを理解していました。 setTimeout() でコールバックをセットし、何が必要かは (new Date()).milliseconds (または同等) の値に基づいて実行する必要があることを決定します。これにより、新しいブラウザでより信頼性の高いタイマー サポートを利用しながら、古いブラウザでも適切に動作させることができます。

また、次のようなことも可能になります。 多くのタイマーを使用することを避ける ! ここが重要なのですが、各タイマーはコールバックなのです。各コールバックは JS コードを実行します。JS コードが実行されている間、他のコールバックを含むブラウザ イベントは遅延またはドロップされます。コールバックが終了すると、他のコールバックは他のブラウザ イベントと実行の機会を争う必要があります。したがって、その間隔のすべての保留中のタスクを処理する 1 つのタイマーは、間隔が一致する 2 つのタイマーよりも性能が良く、（短いタイムアウトの場合は）タイムアウトが重なる 2 つのタイマーよりも性能が良くなります!

まとめ: setTimeout() を使うのをやめ、リアルタイムクロックを使ってUIアクションをスムーズにします。