2

我知道该setInterval函数几乎是单线程的。但是如果我们将时间设置为一个非常小的值，比如 50 毫秒：

setInterval(function()
{
  // do really heavy stuff
}, 50);

那么第一个生成的事件可能不会及时完成然后我猜第二个事件被放入浏览器的队列，然后是第三个，第四个等等。所以基本上这意味着浏览器的队列变得非常快，这显然不是一件好事（是吗？ ）

到目前为止，我已经提出了这两个解决方案：

1）等待第一个事件完成，然后调用第二个事件（通过使用超时）：

var func = function()
{
  setTimeout(function()
  {
    // do really heavy stuff and when it's finished call again
    func();
  }, 50)
}

2) 创建一个监控事件状态的标志：

var isIntervalInProcess = false;
setInterval(function()
{
  if ( isIntervalInProcess )
    return false;

  isIntervalInProcess = true;

  // do really heavy stuff

  isIntervalInProcess = false;

}, 50);

那些消除事件重叠的最佳实践是否重叠？

4

1 回答 1

3

这些消除事件的最佳实践是否重叠？

您提供的第一个示例是一种用于避免setInterval. 就“最佳实践”而言，您应该为正确的情况选择正确的技术（是的，不幸的是，这很模糊）。

setInterval在动画中使用短时间间隔很常见。在这些情况下，应为性能优化回调并轻松取消。jQuery 使用 15ms 的延迟，效果很好。

对于运行时间较长的函数，最好将它们分解为异步函数队列。一遍又一遍地排队相同的功能与您的第一个setTimeout示例相同。

您的第二个示例存在回调队列中的项目永远不会乱序执行的问题。第二个排队的函数只会在第一个函数执行后才被调用，此时可能会有 2 或 3 个更多的函数排队。

然而，有一种cached polling技术允许回调的主体仅在发生状态更改时执行：

(function () {
    var temp;
    setInterval(function () {
        var val;
        val = getSomeValue(); //some fast data accessor
        if (val === temp) {
            return; //break out of the function early
        }
        ...code to execute when the state has changed...
        temp = val; //cache the last state
    }, shortDelay);
}());
于 2012-11-10T21:36:53.830 回答