Как часто срабатывает xhr.upload.onProgress?

Question

Я подписываюсь на событие onProgress при загрузке файла через XHR. Мой индикатор выполнения анимирован (через jQuery), чтобы обеспечить лучшую визуальную эстетику.

onProgress, кажется, срабатывает очень быстро, поэтому мне было интересно, как часто он действительно запускается, чтобы я мог каким-то образом разработать процесс, с помощью которого я мог бы регулировать реакцию на это, чтобы у меня была одна непрерывно анимированная строка прогресса

Answer 1

Хотя расширение JQuery может быть полезным;для чего-то это простое расширение jQuery не стоит накладных расходов.Эффективное решение для ограничения вызовов функций может быть записано как:

xhr.upload.onprogress = function(event) {
  // limit calls to this function
  if (!this.NextSecond) this.NextSecond = 0;
  if (Date.getTime() < this.NextSecond) return;
  this.NextSecond = Date.getTime() + 1000;

  // this code gets executed at least one second apart from the last time
}

Answer 2

Воспользуйтесь плагином jQuery throttle / debounce для регулирования вызовов на ваш onprogress обратный вызов.

Дросселирование демонстраций: http://benalman.com/code/projects/jquery-throttle-debounce/examples/throttle/

Ваш код будет выглядетькак то так:

xhr.upload.onprogress = $.throttle(100, function (event)
{
    // update the progress bar
});

Answer 3

_.throttle(function, wait)

У UnderscoreJS есть утилиты для функций регулирования.

Фактическая сумма, запущенная onProgress get, зависит от браузера, поэтому лучше регулировать реальный обратный вызовна основе решения на основе времени.