Javascript UI元素冻结，尽管webworker

我正在开发一个简单的排序算法演示应用程序。我有一些用JavaScript编写的排序算法，还有一个HTML页面可以试用。我已经分别测试了这些算法，它们工作得很好

您可以输入自己的数组，也可以为您生成一个随机数组。如果数组太大，无论是生成还是排序，都会挂起UI，因此我添加了一个webworker，在单独的线程中执行这些操作

应用程序记录它正在做的事情。在webworker之前，当使用非常大的阵列时，日志只会在过程完成后突然出现，但由于webworker，日志会在每个步骤完成后立即出现。此外，页面保持可滚动，而没有工作人员，所有内容都将冻结，直到工作完成

将计算量大的元素委托给webworker后，我希望页面上的元素保持完全交互，但事实似乎并非如此。页面上的所有按钮等仍将无响应。确切地说，它们保持交互的时间很短，然后冻结--例如，如果我将鼠标移到按钮上，光标将改变形状，但无论我将光标移动到何处，光标都将保持该形状不变，并且如果我单击，则在webworker完成其工作之前，单击不会注册。这是一个问题，因为我有“停止”按钮，如果生成数组或对其排序花费的时间太长，用户可能会单击以停止webworker。就目前情况而言，停止按钮会冻结，如果您单击它们，这只会在工作人员完成之后生效，实际上使它们变得无用

---

如何确保页面上的控件保持可用？谢谢

所以，我遇到了我认为是同一个问题，并且忍受了好几天。谢天谢地，我偶然发现：

由于某种原因，在Chrome和Firefox上，当webworkers发布消息时，它在打包数据的过程中冻结了主线程

如果在发布消息时使用JSON对所有对象进行完全序列化，似乎可以让一切运行得更加顺畅