javascript - 当失去焦点时，SetInterval 不在 Firefox 中运行

Question

我有一个setInterval倒计时的功能。

  startCountDownWorker() {
    this.worker= setInterval(() => {
      this.countDown--;

      // When count timer reach zero
      if (this.countDown === 0) {

        // Clear decrement for count down
        clearInterval(this.worker);
        }
      }
    }, 1000);
  }

该功能在Chrome, Firefox, Opera,上进行了测试，Safari除了Firefox. 当失去对 Tab/Window on 的关注时Firefox，该功能停止并且仅在我重新关注 Tab 时恢复。有什么办法可以解决这个问题？？

标签： javascript

Answer 1

当页面模糊时，浏览器确实对几乎所有的计时函数都应用了一个阈值，因此所有这些超时函数可能只会偶尔执行一次。

不仅如此，甚至还有一个正在起草的传入页面生命周期 API ，它将为页面的可见性添加丢弃和冻结 状态，在此期间，您的脚本根本不会执行，直到解冻。

因此，在你的位置上最好的，为了未来的证明，因为你显然只需要一个相当长的间隔，可能是处理可见性变化并记录页面变得模糊的时间，然后当它重新聚焦时，更新你的计数器基于实际经过的时间。

另一个更可靠的解决方案是不在countDown您的计数器中实际保存实际值，而是始终计算该计数器的开始时间与现在之间的增量。这样，您就不必依赖浏览器计时器的精度，并且可以调整每次滴答之间的超时时间。