Javascript 过度使用window.setTimeout

因此，我有一个单页应用程序，每当用户执行类似于单击按钮的操作时，它都会进行大量计算。由于javascript不是线程化的，冗长的计算会阻止UI更新，并造成糟糕的用户体验：

$('update-btn').click() {
  updateDomWithAnimation();
  doLenghtyCalc();
}

在阅读了太多关于如何处理这个问题的文章之后，我发现用

window.setTimeout

包装一些函数调用确实有帮助。因此，有了这些知识，我开始将它们包装起来，它似乎能为浏览器带来一些响应

然而，我的问题是，即使延迟仅为0或1，过多的超时语句是否会产生不良副作用？从业务逻辑的角度来看，我要确保setTimeout中只包装独立的函数。我想从技术角度进行检查。任何JS大师都能分享一些见解吗

注：我已经看过Web Workers，但是我的代码是使用Jquery构建的，并且严重依赖于DOM状态等，所以实现Web Workers atm是不可能的，这就是我使用超时的原因

---

非常感谢

虽然从技术上讲，可以运行几个超时，但通常建议不要有太多超时

我们做的一件事是有一个timeout/setInterval，每个timeout/setInterval在被激发时运行一组可以随时添加或删除的函数

///Somewhere
var runnableFunctions = []
var runningIntervalID = window.setInterval(function() { 
    runnableFunctions.forEach(function(func) {
        if(typeof func === 'function') {
            func.call(null);
        }
    }, 1);


/// Elsewhere
$(domElem).on(event, function() {
    runnableFucntions.push(function() {
        //Do something on interval
        // slice out this function if it only needs to run once.
    });
});

---

这只是一个不好的例子，但你可以将函数放入数组中，让它们在一个超时/间隔内运行，而不是设置许多超时/间隔，然后记得稍后停止它们。

可能需要研究如何使用js在客户端设备上运行。。所以，如果你的代码欺骗了某人，那么它将只是客户机。。。我还是不明白你为什么要这么晚。。。也许你可以告诉我们更多关于你的工作的细节scenario@charlietfl：谢谢你的链接，我已经看过了，但是我的代码是使用Jquery构建的，并且严重依赖于DOM状态等，因此实现web workers atm是不可能的，这就是为什么我使用TimeOuts来更详细地将数组从函数数组更改为包含所述函数的对象数组。这将使以后更容易删除目标，或者检查是否已经注册。@Amit在我加入目前的公司之前，他们有100多个注册计时器运行来做各种事情。有些阻塞，有些不阻塞。当函数开始像那样堆积时，我们就失去了计时器本身的保真度。设定的时间间隔为1000秒时，开始燃烧约10-20%的时间。虽然不是我能想到的最好的参考资料，但请看。至少这表明你所描述的问题是众所周知的，是可以解决的。很难说是否有特定的浏览器实现了一个可靠的架构来缓解这个问题，但我建议在得出结论之前彻底测试这些假设。