浏览器非活动页定时器执行频率下降的问题_浏览器切换页面定时器任务频率降低

作者：繁依Fanyi0 | 2024-02-22 06:22:25

踩

浏览器切换页面定时器任务频率降低

当我们使用setTimeout或者setInterval等计时器的时候,如果我们设置了0.1秒执行一次,但当我们切换了活动页,或者我们最小化了浏览器,这时因为浏览器的省电策略,会把我们的计时器延长为1s执行一次.下面简单测试一下.

代码:

正常情况下即当前页是活动页输出结果:

可以看到大概是一秒输出了十次,现在再来看看我把浏览器页面最小化之后的输出:

这就变成了1s才执行一次,这是因为浏览器的省电策略,浏览器认为当我们当前页面不在活动页了,就不太需要占用资源,就把我们的计时器频率变慢了.

解决方法就是使用webWorker,把计时器放在其他的线程去执行.

简单实现:

现在看执行结果:

当我把浏览器最小化的时候完全不影响webWorker线程里的计时器的执行.

在vue项目中直接安装引用hackTimer就可以.

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/128883?site