2秒間のスロットル機能

Question

ファイルサイズやスピードなどのダウンロード情報を表示する次の機能があります。情報は1秒に数回更新されるようです。表示された情報をジッタから守るために、progressInfoセクションを2秒ごとに更新するだけです。

私はすでにタイムアウトやインターバルを使用して試してみたが、これが動作するように見えることはできません。

https.get(options, function (update) { 
    update.on('data', function (chunk) { 
     file.write(chunk); 
     len += chunk.length; 
     fileDownloaded = (len/1048576).toFixed(1); 
     now = Date.now(); speed = len/(now - startTime)/1024; 
     speed = ' - ' + speed.toFixed(1) + ' MB/s'; 

     setInterval(function() { 
      progressInfo.html(fileDownloaded + ' MB of ' + speed); 
     }, 2000); 
    }); 
}); 

Answer 1

ただ、関数の後に繰り返し関数呼び出しを防ぎますすでに呼び出されています。単純なフラグを使用して、htmlを更新するか、processInfo更新がすでに開始されているかどうかを確認することができます。

setIntervall(function, milliseconds)の代わりにsetTimeout(function, milliseconds)を使用すると、processInfo関数の更新を1つだけ実行することができます。

var update = null; 
https.get(options, function (update) { 
    update.on('data', function (chunk) { 
     file.write(chunk); 
     len += chunk.length; 
     fileDownloaded = (len/1048576).toFixed(1); 
     now = Date.now(); speed = len/(now - startTime)/1024; 
     speed = ' - ' + speed.toFixed(1) + ' MB/s'; 
     If(update == null) { 
      update = false 
      updateHTML(); 
     } 
     else if(update) { 
      update = false; 
      setTimeout(updateHTML, 2000); 
     } 
    }); 
}); 

var updateHTML = function() { 
        progressInfo.html(fileDownloaded + ' MB of ' + speed); 
       update = true; 
} 

Answer 2

ロダッシュまたはアンダースコアのスロットル機能を使用してみてください。アンダースコアのドキュメントから

：

スロットルが

_.throttle(function, wait, [options]) 

を作成し、新しいを返し、繰り返し呼び出されたときに、唯一実際に呼び出す、という 、渡された関数のバージョンを絞ります元の は、たいてい、待機時間ごとに1回のミリ秒で機能します。あなたが追いつくことができるよりも速く発生するレート制限イベント に役立ちます。

function updateProgress(fileDownloaded, speed) { 
    progressInfo.html(fileDownloaded + ' MB of ' + speed); 
} 

function throttledProgress = _.throttle(updateProgress, 2000); 

https.get(options, function (update) { 
    update.on('data', function (chunk) { 
     file.write(chunk); 
     len += chunk.length; 
     fileDownloaded = (len/1048576).toFixed(1); 
     now = Date.now(); speed = len/(now - startTime)/1024; 
     speed = ' - ' + speed.toFixed(1) + ' MB/s'; 
     // invoked the throttled function here 
     throttledProgress(fileDownloaded, speed) 
    }); 
}); 

あなたはこの1ケースを処理するために、全体の外部ライブラリを追加したくない場合は、ここでスロットリング機能の簡単なimplimentationだ

var throttle = function(func, wait) { 
    var timer; 
    return function(){ 
    var currTime = new Date(); 
    var elapsed = currTime - timer; 
    if (timer === undefined || elapsed > wait){ 
     func.apply(this, arguments); 
     timer = currTime; 
    } 
    }; 
};