53. Project: parallel uploads with concurrency

Project 5 — parallelism with a limit

Uploading files: 100 files with 100 parallel requests will floor the browser, while strictly one at a time is painfully slow. You need a compromise — say, 2 at once. mergeMap has a secret second argument: concurrency.

from(files).pipe(
  mergeMap(file => uploadFile(file), 2)
)
// at most 2 uploads run at any moment

How to read the expected order

Files: A (60ms), B (20ms), C (10ms), D (5ms). Concurrency=2 means: A and B start. B finishes after 20ms — C starts. After 30ms C finishes — D starts. After 35ms D is done. A is still running its 60ms and finishes last. Output order: B, C, D, A.

const { from, mergeMap } = Rx;

function uploadFiles$(files, uploadFile) {
  return from(files).pipe(
    mergeMap(file => uploadFile(file), 2)
  );
}