The downsides of async/await

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await#The_downsides_of_asyncawait

by newtnik

HTML

<html>
<body>
<div id="output">
</div>
</body>
</html>

JavaScript

function timeoutPromise(interval) {
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      resolve("done");
    }, interval);
  });
}

async function timeTestSlow(interval) {
  await timeoutPromise(interval);
  await timeoutPromise(interval);
  await timeoutPromise(interval);
}

async function timeTestFast() {
  const timeoutPromise1 = timeoutPromise(interval);
  const timeoutPromise2 = timeoutPromise(interval);
  const timeoutPromise3 = timeoutPromise(interval);
  await timeoutPromise1;
  await timeoutPromise2;
  await timeoutPromise3;
}

const interval = 1000;
let startTime = Date.now();
timeTestSlow(interval).then(() => {
  document.getElementById("output").innerHTML += "<p>Slow test ran in " + (Date.now() - startTime) + "ms</p>";
})

startTime = Date.now();
timeTestFast(interval).then(() => {
  document.getElementById("output").innerHTML += "<p>Fast test ran in " + (Date.now() - startTime) + "ms</p>";
})