JavaScript classes online

Waiting together

Sequential awaits pay for every round trip one after another. Promise.all lets the eight requests overlap, which was between about five and eight times faster here.

The fast wrong answer

The forEach version looked fastest at 8.5 ms because it did not wait at all. MDN says plainly that forEach "does not wait for promises".

When one at a time is right

If a service limits how many requests you may send at once, or each request needs the previous answer, the slow sequential loop is the correct choice. Speed is not the only test.

What Promise.all promises

MDN describes it as taking "an iterable of promises as input" and returning "a single Promise". It also warns that the result "rejects when any of the input's promises rejects", so one failed request fails the lot.

Learners write the version that handles one failure without losing the other seven.

Why we used real requests

Timings over a real network vary, which is why we show two rounds. The ratio between the approaches is the lesson, not the exact milliseconds.

Eight small requests are a light load on a public data service, and we ran only two rounds.

The async example, seen live

In the network panel, the sequential version shows eight requests as a staircase; the Promise.all version shows them stacked side by side.

Seeing the shape makes the timing difference obvious without reading a single number.

Reading errors calmly

Learners practise reading an error message from the top: what kind of error, on which line, in which file.

Most beginner bugs are solved by the first line of the first error.