Question

I am subscribing to the onProgress event when uploading a file via XHR. My progress bar is animated (via jQuery) to provide a better visual aesthetic.

onProgress seems to fire very rapidly, so I wondered how often it actually gets fired so that I can somehow devise a process whereby I can throttle responses to this so that I can have one continuously animated progress bar

Answer 1

Check out the jQuery throttle/debounce plugin for throttling the calls to your onprogress callback.

Throttling demos: http://benalman.com/code/projects/jquery-throttle-debounce/examples/throttle/

Your code would look something like this:

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