运行javascript函数时CSS动画停止

Question

假设我有这个javascript函数：

   function pauseComp(ms) {
     var date = new Date();
     var curDate = null;
     do { curDate = new Date(); }
     while(curDate-date < ms);
    }

和css3动画（例如，来自新font-awesome 3的<i class="icon-spinner icon-spin"></i>）。当我运行上面的javascript函数时，它会在函数运行时停止微调器。 看看我在说什么here 。基本上，javascript停止css动画，我想知道为什么，或者如果有人注意到这个/找到了一个解决方法。我已经尝试将它放在setTimeout（fn，0）中，其中fn是长进程，但后来意识到为什么它也不起作用（js不是多线程的）。有人看到过这种情况吗？

更新：有趣的是，尽管与浏览器界面的交互仍然受到影响，但看起来这在Safari中并不是一个问题。

Answer 1

浏览器页面是单线程的。更新UI发生在与javascript程序相同的线程上。这也意味着任何动画都不会在执行Javascript代码时绘制新帧。通常，这没什么大不了的，因为大多数JS代码执行得非常快，比单个动画帧更快。

所以最好的建议就是：不要这样做。不要长时间锁定JS引擎。找出一种更清洁的方法。

---

然而，如果必须，有一种方法。您可以通过HTML5's Web Workers API获得额外的帖子。在旧版浏览器中不支持此功能，但它允许您从主网页和自己的线程中运行一些长时间运行的CPU吸引代码，然后在完成后将一些结果发回到您的页面。