Question

我的问题需要以下函数在平均20次迭代的循环中运行

var test = function() {
  // some logic which take about 0.5 sec to execute
  // and deal with DOM manipulation
};

所以如果我重复它20个项目，它将平均需要10秒，同时浏览器挂起（无法向下滚动）。

所以我试着把它改成像这样的东西

var test = function() {
   setTimeout(function() {
      // some logic which take about 0.5 sec to execute
      // 0.5 sec as it deals with DOM manipulation
   }, 0);
};

以便浏览器在每次Out后都有时间执行但仍然挂起浏览器。

为什么会这样？这是我一直在理论上阅读但实际上没有工作的东西。

Answer 1

这就是JavaScript的工作方式，无论何时阻止主线程，您的网站都会对事件无响应。

您应该真正尝试更有效地解析模板。在用户体验中，10s是永恒的。

如果这不是一个选项，你可以考虑将一些逻辑移动到另一个线程并通过web workers异步执行它，并且只在主线程中执行实际的DOM操作。

浏览器在循环中计算强大的JS函数后会挂起

1 个答案: