title: Why async function appears as long-task?
body: <p>I am running the following code:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function heavyCalculation(ms = 50) {
    const end = performance.now() + ms;
    while (performance.now() &lt; end) {}
    console.log('main thread released ', ms)
  }
  
  async function blocker() {
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
    await heavyCalculation(10);
  }
  
  setTimeout(() =&gt; {
    blocker();
  }, 2500)</code></pre>
  </div>
  </div>
  </p>
  <p>I would expect no long tasks to be marked in Chrome dev-tools. But this function appears as one:</p>
  <p><a href="https://i.stack.imgur.com/js5SS.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/js5SS.png" alt="enter image description here" /></a></p>
  <p>Why? How to make this task not appear as a long task?</p>