异步承诺阻止DOM

Question

异步承诺无法按我期望的那样在React中工作（特别是React，但是我认为这将适用于其他情况）。他们似乎仍然阻塞了主线程，实质上冻结了我的浏览器。

我有处理按钮单击的方法：

onClick() {
  console.time('factorial')
  factorial(8000) // factorial is the culprit!
    .then(n => this.setState({ n }))
  console.endTime('factorial')
}

factorial返回一个Promise，因此，按预期，我在控制台中得到了factorial: 2ms。但是，该网页挂起。在查看性能指标时，这也很明显：

Promise需要700毫秒以上的时间来评估，并且在整个持续时间内，DOM似乎都被阻止了。这完全使我感到困惑，因为我希望DOM能够继续下去。如何获得factorial函数以不阻止DOM？

Answer 1

异步函数不是线程。

他们在等待JavaScript事件循环之外的事件发生时（例如，到达HTTP响应）而暂停并置于后台。

虽然它们正在运行，但是它们仍在运行，并且像其他任何函数一样捆绑事件循环。

如果要将某些处理分流到另一个线程，则需要使用Web Workers。 （至少在Web浏览器的上下文中； Node具有Worker Threads）。