JavaScript で正確なタイマーを作成するにはどうすればよいですか?

JavaScript での正確なタイマーの作成

setTimeout() と setInterval() の不正確な性質のため、JavaScript で正確な時間間隔を決定するのは困難な場合があります。 ).

の不正確さsetTimeout() と setInterval()

setTimeout() と setInterval() はブラウザのスケジュール メカニズムに依存しており、システム リソースやブラウザのアクティビティの影響を受ける可能性があります。この固有の変動性は、指定された例で示されているように、不整合や信頼性の低いタイミングにつながる可能性があります。

解決策: Date オブジェクトの使用

正確なタイマーを作成するには、Date オブジェクトの使用を検討してください。オブジェクトの now() メソッドを使用して、現在のミリ秒タイムスタンプを取得します。このアプローチでは、コールバック ベースのメソッドと比較して精度が向上します。

単純なタイマーの実装:

基本的なタイミング シナリオの場合、次のアプローチを使用して時間差を明示的に追跡できます。 :

var start = Date.now();
setInterval(function() {
    var delta = Date.now() - start; // milliseconds since start
    ...
    output(Math.floor(delta / 1000)); // in seconds
}, 1000);

このメソッドは、タイマーの開始からの時間差を追跡します。潜在的な値のジャンプを回避するには、間隔をより頻繁に (100 ミリ秒ごとなど) 更新することをお勧めします。

自動調整タイマー

正確でドリフトしない間隔については、自動調整タイマーを実装できます。これらのタイマーは、実際の経過時間に基づいて、繰り返されるタイムアウトごとに遅延を調整します。

var interval = 1000; // ms
var expected = Date.now() + interval;
setTimeout(step, interval);
function step() {
    var dt = Date.now() - expected; // drift
    ...
    expected += interval;
    setTimeout(step, Math.max(0, interval - dt)); // adjust delay for drift
}

このアプローチでは、時間のドリフトを監視し、不一致を補正して、より正確なタイミング ケイデンスを保証します。

以上がJavaScript で正確なタイマーを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。