博客逐步迁移到,独立博客,原文地址,http://www.woniubi.cn/js_hide_tab_setinterval/

我们一直都在说,JS的定时非常的不准确,但是很少有人去验证他,今天我就来验证一下。首先我们准备一个简单的例子。

简单例子

每隔一秒钟,然后输出离最开始的时间差距有多大。

 <script type="text/javascript">
var begin = (new Date()).getTime();
var i = 0;
setInterval(function(){
++i;
var now = (new Date()).getTime();
var intvals = ((now - begin)/1000).toFixed(3);
var str = "num:" + i + ";use time:" + intvals;
console.log(str);
},1000);
</script>

  

然后我们看一下输出结果。

看起来结果这没有什么呀,每次只是延时1ms而已,对于我来说,没有什么影响。

世界不可能永远都是平静的,当资源变成了稀缺,竞争加剧的时候,一切都不是那么美好了。

非活动Tab

非活动Tab,就是非当前Tab。浏览器有一种机制,就是优先保证当前Tab资源优先使用。我们可以换一种方式说。

活动Tab,相当于太子,其他的都是一些阿哥。如果太子吃肉,阿哥可以也干粮。太子连干粮也吃的话,阿哥们只能喝汤了,还是一些阿哥抢着喝汤。没办法,资源就是这么多,不是我不想给你。

这个例子也很简单,就是活动Tab干一件非常消耗CPU的事情,然后我们过一会去观察我们刚才的Tab。

for(var i = 0;i!=100000;++i){
console.log(i);
}

这次结果就不是那样简单了,看看,这是多么不靠谱的定时呀。

活动Tab

其实你也许说这不能反应问题,如果非活动页面如果做耗时CPU,活动页面定时一样不准?我就做了这么一个测试。结果是这样的

活动Tab就是不一般呀,延时只是稍微变慢了一点。

JS的定时到底有多不准的更多相关文章

  1. JS中new到底发生了什么

    outline prototype 与 __proto__ function 与 object new 到底发生了什么 prototype 与 __proto__ 首先说下在JS中比较容易让人困惑的  ...

  2. js的arguments到底是什么?

    类数组对象:arguments 总所周知,js是一门相当灵活的语言.当我们在js中在调用一个函数的时候,我们经常会给这个函数传递一些参数,js把传入到这个函数的全部参数存储在一个叫做arguments ...

  3. js 中this到底指向哪里?

    其实js的this指向很简单.我们记住下面3种情况. this 指向的是浏览器中的window.代码如下: function fn(){ this.name='yangkun'; this.age=2 ...

  4. js中‘0’到底是 true 还是 false

    if ('0') alert("'0' is true");  if ('0' == false) alert("'0' is false");结果是,两次都 ...

  5. JS 循环定时的一些思考

    网上也有例子, function doSetTimeout(i) { setTimeout(function() { console.log(i); }, 1000); } for (var i = ...

  6. 转自知乎大神----JS 的 new 到底是干什么的?

    大部分讲 new 的文章会从面向对象的思路讲起,但是我始终认为,在解释一个事物的时候,不应该引入另一个更复杂的事物. 今天我从「省代码」的角度来讲 new. --------------------- ...

  7. js实现定时调用的函数setInterval()

    setInterval是一个实现定时调用的函数,可按照指定的周期(以毫秒计)来调用函数或计算表达式.setInterval方法会不停地调用函数,直到 clearInterval被调用或窗口被关闭 定义 ...

  8. js手动定时清除localStorage

    <script type="text/javascript"> // 假设要保存变量 a 的值,过期时间为 3600秒 // 保存值 var obj = new Obj ...

  9. js设置定时执行

    具体语法参考:https://www.runoob.com/jsref/met-win-setinterval.html var timer = window.setInterval(function ...

随机推荐

  1. [BZOJ4916]神犇和蒟蒻 杜教筛/Min_25筛

    题目大意: 给定\(n\le 10^9\),求: 1.\(\sum_{i=1}^n\mu(i^2)\) 2.\(\sum_{i=1}^n\varphi(i^2)\) 解释 1.\(\sum_{i=1} ...

  2. php小试牛刀

    [构造函数] function __construct() [析构函数] 当某个对象的所有引用被删除,或者对象被显式的销毁时会执行析构函数 function __destruct() [静态方法] p ...

  3. Django2.0以上版本的URL的正则匹配问题

    正则表达式形式的URL匹配问题: 1.导入re_path from django.urls import path,re_path 2.进行正则匹配 re_path('detail-(\d+).htm ...

  4. Folyd算法(转+适合问题 )

    Folyd算法适合多源最短路的求解问题(时间复杂度(O(n^3)),单源无负权值的问题适合Dijstra(O(n^2)) 小Hi强行装作没听到,继续说道:"这个算法的核心之处在于数学归纳法- ...

  5. 创建Banner

    org.springframework.boot.SpringApplicationBannerPrinter#print(org.springframework.core.env.Environme ...

  6. ORA-12012 ORA-20001 on ORACLE 12C (2420581.1)

    Oracle数据库 - 企业版 - 12.2.0.1及更高版本本文档中的信息适用于任何平台.   Doc ID 2420581.1 症状 在容器数据库中,警报日志中会显示以下错误: ORA-12012 ...

  7. ES6数组新增方法总结

    关于数组中forEach() .map().filter().reduce().some().every()的总结 let arr = [1, 2, 3, 4, 5] // forEach遍历数组 a ...

  8. SparseArray替代HashMap来提高性能

    SparseArray是 Android框架独有的类,在标准的JDK中不存在这个类.它要比 HashMap 节省内存,某些情况下比HashMap性能更好,按照官方问答的解释,主要是因为SparseAr ...

  9. oracle 中 Start with...connect by 的用法(递归查询)

    阿里电面问到了相关的知识,在网上找到这方面的文章. 这几个关键字是查询递归数据的,形成一个树状结构.目前只有oracle支持,其他数据都要结合存储过程实现 语法: select * from some ...

  10. 牛客网Java刷题知识点之字节缓冲区练习之从A处复制文本文件到B处(BufferedReader、BufferedWriter)、复制文本文件的原理图解

    不多说,直接上干货! CopyTextByBufTest.java package zhouls.bigdata.DataFeatureSelection.test; import java.io.B ...