[JS] One Mistake I Made with await in a Loop

A while back, I built a utility script to process thousands of items with an async function. I thought slapping await inside a for() loop would do the trick. Spoiler: it didn’t!

That simple mistake taught me a big lesson about how await, for, map, and Promise.all work. As a back-end developer, I now use this trick to optimize APIs. In this post, I’ll break down what went wrong and how I fixed it with Promise.all.

Here’s the messy code I started with:

for (const item of items) {
  await process(item);
}

At first, I thought I was a genius. Slapping await inside a for() Loop to process an array? Worked like a charm… until I hit 500+ items. My script crawled slower than a turtle stuck in traffic.

The rookie mistake? I was running tasks one by one, like a single-threaded program. No parallelism, no speed. Oh my god.

The better approach was to use Promise.all

 await Promise.all(arr.map(item => Process(item)));

Boom! Execution time dropped from 5 seconds to 0.5 seconds. As a back-end dev, I now use this trick to turbocharge my APIs.

Lesson learned: If you don’t need strict order, avoid await inside loops. Always check if the task can be parallelized.

Here’s the full code to try it yourself:

async function Process(data) {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log(data);
      resolve();
    }, 500);
  });
}

async function main() {
  const start = process.hrtime.bigint();

  const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];


  for (const item of arr) {
    await Process(item);
  }

  // parallelized
  // await Promise.all(arr.map(item => Process(item)));

  const end = process.hrtime.bigint();
  const durationNanoseconds = end - start;
  const durationSeconds = Number(durationNanoseconds) / 1_000_000_000;

  console.log(`Sequential execution time: ${durationSeconds.toFixed(3)} seconds`);
}

main();

Thanks for reading!