Works with any backend npm install Zero dependencies

Speed & ETA

Display real-time upload speed and estimated time remaining using the speed and eta properties from the onTaskProgress callback.

Speed: -- ETA: --
new MultipleUpload(document.getElementById('demo-speed-eta'), {
 uploadUrl: '/api/upload',
 multiple: true,
 onTaskProgress: function(task) {
 document.getElementById('speed-label').textContent =
 'Speed: ' + MultipleUpload.formatSize(task.speed) + '/s';
 document.getElementById('eta-label').textContent =
 'ETA: ' + MultipleUpload.formatTime(task.eta);
 },
 onComplete: function() {
 document.getElementById('speed-label').textContent = 'Speed: Done';
 document.getElementById('eta-label').textContent = 'ETA: --';
 }
});

Rate and time remaining

Both are derived from progress events: bytes over elapsed time gives a rate, and the remaining bytes divided by that rate gives an estimate. getStats() on the instance exposes the aggregate numbers if you would rather not track them yourself.

Smooth it or it is unreadable

An instantaneous rate swings wildly with every chunk and every scheduling hiccup, and an ETA derived from it jumps between twenty seconds and four minutes. A rolling average over a few seconds is what makes both numbers usable — and an ETA that changes direction constantly is worse than no ETA at all.