setTimeout,setInterval 谷歌内核浏览器切换标签(非激活状态)时,限制速度

    最近做开发,开发一个客服呼叫系统. 遇见一个很小的需求。客服端有一个电话监听事件,如果有电话打进来,把浏览器title滚动播放。

    刚听完这个需求,对于一个老程序来说这也太简单了。随便百度个类似插件,集成上去不就ok了吗。

    然后就找到了个叫Title.js的轮播插件。可以轮播,可以修改,可以加前后缀。代码如下:

    源码地址:https://github.com/arkaindas/titlejs

      然后,对插件代码做了少许处理,来方便关闭轮播效果。

image.png

   然后直接引入,调用。ok,完工了吧?

Title.animation("typeWriter");

   NO!!!!!F**K!!!!!!!!!

万万没想到,在chrome上,如果页面标签非活动状态,那么运行非常缓慢,不管怎么改定时器的时间间隔。这样的话,就达不到清晰提示的目的,简直就是鸡肋。

   So。。。what is the matter?

   查百度,竟然几乎没有人问这个问题。然后就可是一通乱翻,不经意间,发现一个插件.简介只有一句话:Avoid timers throttling by browser when tab is inactive。

    一句话就够了,要的就是这个。引入到项目试了下,完全符合预期。

 

    查资料,貌似是谷歌chrome为了性能,自动判断当前页签是否是活动状态,如果不是的话,settimeout最快也是每秒执行一次,不管参数是多小。而在IE浏览器是不会出现这个情况的(懒得测试FF)。

    

    本来觉得一个很简单的需求,结果坑了自己将近2个小时。一入IT深似海。。。

转载自:http://www.phpnote.net/index.php/Home/Article/index/id/196

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值