javascript - JavaScript 一次函数调用期间的多次更新

Question

我正在尝试编写一些执行大量计算的脚本。因此，我想通过更新网站上的内容（例如，已完成计算的一部分）来通知用户进度。可以用 JavaScript 实现吗？JavaScript 是否允许在调用的函数仍在运行时更新内容？或者无论在什么情况下，我只能在调用函数完成后更新内容？

Answer 1

看看工人：http ://www.html5rocks.com/en/tutorials/workers/basics/

它是为大量计算而设计的（在 javascript 规模 ofc 上），并带有一些用于更新用户计算状态的功能，它基本上是 javascript 中的多线程。

Answer 2

使用计时器

从您的计算功能，更新全局变量。

然后从主线程，使用setTimeout()orsetInterval()定期查询全局值并更新屏幕。

Answer 3

当你的函数运行时，不会发生屏幕更新：UI 线程必须像任何其他 JS 线程一样争取时间。您可以通过安排回调来做到这一点：

function f() {
  a();
  // update now
  b();
}

可以改写为

function f() {
  a();
  setTimeout(function() {
    b();
  }, 0);
}

这个工作方式，之后a()，setTimeout将安排函数的其余部分，然后退出。这是 UI 线程现在可以（并且将会）获取控制权的地方；然后在完成后，将执行预定的剩余部分。

如果你有符合（相当严格的）WebWorker 限制的事情，你可以使用它们来代替；但是，它们不能触摸 UI，因此重绘将毫无意义（除非您按照 Antoine 所说的那样做，并根据 WebWorker 计算的参数安排更新功能）。

Answer 4

我的几分钱：

• 最简单的解决方法是简单地显示繁忙动画的最常见方法。

• 尝试将您的重量级计算代码分解并更新进度条。

• 或者按照Antoine的建议，尝试使用Web Workers。

Answer 5

是的，也许你可以做到。我不知道您问题的所有细节，但您应该针对socket.io和异步node.js。

使用node.js，您可以实时向客户端发送进程状态，并在客户端使用socket.io捕获服务器响应。