JSの最適化、共通のフラグメント

デバウンスデコレータを振ります

これは、n秒で再度タイミングをトリガされた場合、コールバックは、イベント・n秒で起動し、されています。

関数デバウンス(FUNC、遅延){ 
  isCooldownはせ = 返す 関数(){
     場合(isCooldown)リターン
    func.apply(この、引数); 
    isCooldown = ; 
    setTimeout(() => isCooldown = 、遅延)。
  }。
}

 

スロットルスロットルデコレータ

時間の指定単位内では、機能だけ一度にトリガすることができます。タイム・トリガ、複数の機能の中、このユニットは一度だけ有効になります。

関数スロットル(FUNC、遅延){ 

  isThrottledはせ = 
    savedArgs、
    savedThis。

  関数ラッパー(){ 

    場合(isThrottled){ // (2) 
      savedArgs = 引数。
      savedThis = この;
      返します
    } 

    func.apply(この引数)。// (1)

    isThrottled = 

    setTimeout(関数(){ 
      isThrottled =  ; //(3)
      場合(savedArgs){ 
        wrapper.apply(savedThis、savedArgs)。
        savedArgs = savedThis = nullを
      } 
    }、遅延)。
  } 

  戻りラッパー。
}

間の差によって2:

  • 手ぶれ補正機能と機能は、すべての時間が頻繁にトリガースロットルを防ぐため、原則的には、2人の兄弟の間で同じではありません。
  • 画像安定化機能は、一定時間、及び絞り区間の機能を実行するための時間に一度だけ実行されます。

シナリオ:

  • デバウンス
    •   ユーザーがリソースを節約するために、防振要求を使用して、入力値に続く連想検索検索、。
    •   ウィンドウには、トリガーのサイズを変更し、常にブラウザウィンドウのサイズを調整するときに一度だけトリガーさせるために画像安定化と、このイベントをトリガしていきます。
  • スロットル
    •   マウス常にトリガ、マウスダウン(単位時間あたりの一度だけトリガー)をクリックします。
    •   そのようなスライドの底が自動的に判断するスロットルで、より多くのロードかどうかなど、スクロールイベントを、聞きます。

 

おすすめ

転載: www.cnblogs.com/sese/p/11649135.html