2

setInterval関数はほとんどシングルスレッドであることを私は知っています。しかし、時間を50ミリ秒のような非常に小さな値に設定すると、次のようになります。

setInterval(function()
{
  // do really heavy stuff
}, 50);

次に、最初に生成されたイベントが時間内に終了しない可能性があり、2番目のイベントがブラウザのキューに入れられ、次に3番目、4番目などに入れられると思います。したがって、基本的に、これはブラウザのキューが非常に速く大きくなり、明らかに良くないことを意味します（それは...ですか？ ）

これまでのところ、次の2つのソリューションがあります。

1）最初のイベントが終了するのを待ってから、（タイムアウトを使用して）2番目のイベントを呼び出します。

var func = function()
{
  setTimeout(function()
  {
    // do really heavy stuff and when it's finished call again
    func();
  }, 50)
}

2）イベントの状態を監視するフラグを作成します。

var isIntervalInProcess = false;
setInterval(function()
{
  if ( isIntervalInProcess )
    return false;

  isIntervalInProcess = true;

  // do really heavy stuff

  isIntervalInProcess = false;

}, 50);

重複するイベントを取り除くためのこれらのベストプラクティスはありますか？

4

1 に答える 1

3

重複するイベントを取り除くためのこれらのベストプラクティスはありますか？

提供した最初の例は、の落とし穴を回避するために使用される一般的な手法ですsetInterval。「ベストプラクティス」に関する限り、適切な状況に適した手法を選択する必要があります（はい、残念ながら非常にあいまいです）。

setIntervalアニメーションに使用する場合は、短い間隔で短時間使用するのが一般的です。このような場合、コールバックはパフォーマンスのために合理化され、簡単にキャンセルされる必要があります。jQueryは15msの遅延を使用し、それはうまく機能します。

実行時間の長い関数の場合は、それらを非同期関数のキューに分割することをお勧めします。同じ関数を何度もキューに入れることは、最初のsetTimeout例と同じです。

2番目の例には、コールバックキュー内のアイテムが順不同で実行されないという問題があります。2番目のキューに入れられた関数は、最初の関数が実行された後にのみ呼び出されます。その時点で、さらに2つまたは3つの関数がキューに入れられます。

ただし、cached polling状態変化が発生した場合にのみコールバックの本体を実行できるようにする手法があります。

(function () {
    var temp;
    setInterval(function () {
        var val;
        val = getSomeValue(); //some fast data accessor
        if (val === temp) {
            return; //break out of the function early
        }
        ...code to execute when the state has changed...
        temp = val; //cache the last state
    }, shortDelay);
}());
于 2012-11-10T21:36:53.830 に答える