Perform actions as promises get fulfilled using Promise.all()

will run only after all those promises have been resolved. How I can perform actions as the promises get resolved?

For example, I want to load all paragraphs from an article asynchronously using

Promise.all()

- This way the network requests all fire at once. If paragraph 1 is done loading, I want it to render to the page - but only if it is done loading before paragraph 2, then I want paragraph 2 to load. If paragraph 3 is done loading and 2 is not, I want 3 to wait for 2 before rendering to the page. And so on.

Since you need to react to promise results in the same order you make the requests in, here's an example of how you can change your getStuff function a bit and dynamically chain the reactions using Array.prototype.reduce:

var times = [200, 100, 250, 200, 300, 250, 5000];
var getStuff = function(time, index) { // swap the order of arguments so number is the index passed in from Array.map
return new Promise(function(resolve, reject){
window.setTimeout(function(){resolve(`${index + 1} - Done.`)}, time); // use index + 1 because indexes start at 0
});
};
times
// map each time to a promise (and number to the index of that time + 1) and fires of a request
.map(getStuff)
// dynamically build a reaction chain for the results of promises
.reduce((chain, promise) => {
return chain
.then(() => promise)
.then(render)
}, Promise.resolve())
.then(() => {
// all promises resolved (all data was rendered)
});

Email codedump link for Perform actions as promises get fulfilled using Promise.all()