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

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

简单例子

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

  1. <script type="text/javascript">
  2. var begin = (new Date()).getTime();
  3. var i = 0;
  4. setInterval(function(){
  5. ++i;
  6. var now = (new Date()).getTime();
  7. var intvals = ((now - begin)/1000).toFixed(3);
  8. var str = "num:" + i + ";use time:" + intvals;
  9. console.log(str);
  10. },1000);
  11. </script>

  

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

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

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

非活动Tab

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

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

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

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

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

活动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. P3554 [POI2013]LUK-Triumphal arch

    \(\color{#0066ff}{ 题目描述 }\) 给一颗树,1号节点已经被染黑,其余是白的,两个人轮流操作,一开始B在1号节点,A选择k个点染黑,然后B走一步,如果B能走到A没染的节点则B胜,否 ...

  2. 小B的询问 莫队分块

    题目描述 小B有一个序列,包含N个1~K之间的整数.他一共有M个询问,每个询问给定一个区间[L..R],求Sigma(c(i)^2)的值,其中i的值从1到K,其中c(i)表示数字i在[L..R]中的重 ...

  3. 洛谷 P2141 珠心算测验

    嗯... 先看一下这个题.... 题目描述 珠心算是一种通过在脑中模拟算盘变化来完成快速运算的一种计算技术.珠心算训练,既能够开发智力,又能够为日常生活带来很多便利,因而在很多学校得到普及. 某学校的 ...

  4. Mybatis学习笔记(三) —— DAO开发方法

    一.SqlSession的使用范围 SqlSession中封装了对数据库的操作,如:查询.插入.更新.删除等. SqlSession通过SqlSessionFactory创建. SqlSessionF ...

  5. logrotate 日志管理

    查看logrotate 是否已安装 因为linux安装软件的方式比较多,所以没有一个通用的办法能查到某些软件是否安装了.总结起来就是这样几类: 1.rpm包安装的,可以用rpm -qa看到,如果要查找 ...

  6. JQuery判断页面是否按下了Enter键

    $('#someTextBox').keypress(function(event){ var keycode = (event.keyCode ? event.keyCode : event.whi ...

  7. Codeforces-D-Diverse Garland(思维)

    You have a garland consisting of nn lamps. Each lamp is colored red, green or blue. The color of the ...

  8. Nginx常用rewrite跳转重定向实例

    1.将www.myweb.com/connect 跳转到connect.myweb.com rewrite ^/connect$ http://connect.myweb.com permanent; ...

  9. 解决IDEA卡顿问题及相关基本配置

    https://blog.csdn.net/u013068377/article/details/54316965 https://blog.csdn.net/u014527619/article/d ...

  10. js 数字处理Number()

    //js将数字转换保留2位小数 function toDecimal(x) { var val = Number(x) if (!isNaN(parseFloat(val))) { //toFixed ...