requestAnimationFrame与setInterval都可以实现循环触发事件，但是setInterval是基于时间的，而requestAnimationFrame是基于帧数的，在我的一次开发弹幕的项目中，在一开始使用了setInterval来切换弹幕的位置，起初并没有什么问题，但是当浏览器切换回后台后，就会出现弹幕积攒过多的原因，因为我随不断的创建新的弹幕进行移动（为了考虑性能，会优先使用已经被废弃的弹幕盒），当浏览器切换到后台后，浏览器本身已经不进行页面渲染了，而我的定时器却在不断的创建新的弹幕以用来发射，当用户将浏览器切换到前台时候，会看到在一段时间内积攒的弹幕堆积到一起，最后发现是因为 浏览器在后台的时候 定时器还是会不断的跑的，但是在当前这种情况下 我可能并不是很希望弹幕系统继续运行下去，我希望知道浏览器当前状态是在前台还是后台，如果是后台的话 则暂停弹幕，然而在微信中并没有看到相关的机制，后来看到了requestAnimationFrame，requestAnimationFrame也是不断的循环执行事件，但是他是按帧执行的，而且有一个好处是 当浏览器切换到后台后，requestAnimationFrame是不会再去执行事件了。这和setInterval有着本质的差异。而requestAnimationFrame之所以在浏览器进入后台不去执行的原因 ，应该是和浏览器进入后台后不去渲染界面有关，因为渲染界面后需要逐帧绘制，当不进行页面的选然后，也就没必要去执行帧操作了，所以requestAnimationFrame也不会去执行了

如果上述推论是正确的，那可以基此判断出setTimeout在浏览器进入后台后依然会运行，就像setInterval一样

关于requestAnimationFrame与setInterval的一点差异的更多相关文章

  1. requestAnimationFrame与setInterval,setTimeout

    自打学习canvas动画以来,都说requestAnimationFrame好,就一直用,也没觉得有什么太过于特殊的地方,直到刚才,在写完前面的"小球碰撞墙壁----干掉误差"之后 ...

  2. python使用cx_Oracle在Linux和Windows下的一点差异

    1. 主要是线程方面的差异. Windows下,把cx_Oracle.connect(connectedId)得到的handle传给定时器线程,主线程和和定时器可以用同一个handle. 但Linux ...

  3. javascript中正则表达式和ruby中的一点差异

    看到一个例子,不过这个例子中正则表达式的格式貌似是错的: Function.prototype.get_name = function(){ return this.name || this.toSt ...

  4. [bug]android monkey命令在Android N和Android O上的一点差异发现

    最近再调试这个统计FPS的代码,发现代码在android N上可以正常运行,但在android O上却运行不了,拼了命的报错,给出的提示就是 ZeroDivisionError: division b ...

  5. 动画requestAnimationFrame

    前言 在研究canvas的2D pixi.js库的时候,其动画的刷新都用requestAnimationFrame替代了setTimeout 或 setInterval 但是jQuery中还是采用了s ...

  6. 管理页面的 setTimeout & setInterval

    在管理 setTimeout & setInterval 这两个 APIs 时,笔者通常会在顶级(全局)作用域创建一个叫 timer 的对象,在它下面有两个数组成员 —— {sto, siv} ...

  7. 关于requestAnimationFrame()和cancelAnimationFrame()与定时器之间的比较

    在渲染页面动画的时候,其实也没有必要用定时器(setInterval),其实requestAnimationFrame()和cancelAnimationFrame()也能达到相应的效果,他是HTML ...

  8. requestAnimationFrame小结

    背景 在Web应用中,实现动画效果的方法比较多,Javascript 中可以通过定时器 setTimeout或者setInterval 来实现,css3 可以使用 transition 和 anima ...

  9. 关于linux的一点好奇心（五）：进程线程的创建

    一直以来,进程和线程的区别,这种问题一般会被面试官拿来考考面试者,可见这事就不太简单.简单说一点差异是,进程拥有独立的内存资源信息,而线程则共享父进程的资源信息.也就是说线程不拥有内存资源,所以对系统 ...

随机推荐

  1. Python_lambda

    最近学习到python的lambda表达式也是匿名函数, lambda不需要使用def 语句这样标准的形式定义一个函数,并不需要花很多时间去额外定义一个不常用的函数.lambda的本省就是一个长度为一 ...

  2. org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'dataSource' defined in class path resource [app2.xml]: Instantiation of bean failed; nested exception is org.spr

    在学习spring整合hubernate时遇到的问题.c3p0遇到了一个问题,老连不上,显示java.lang.NoClassDefFoundError:com.mchange.v2.ser.Indi ...

  3. C#6.0，C#7.0新特性

    C#6.0新特性 Auto-Property enhancements(自动属性增强) Read-only auto-properties (真正的只读属性) Auto-Property Initia ...

  4. Objective-C RunTime 学习笔记 之 消息转发流程

    1) 当向某个对象发送消息时,先从cache(cache_t)中查找方法对象(method_t),如果找到则进行回调:否则通过查找对象的类(元类)定义中方法列表,一直追溯到NSObject, 如果找到 ...

  5. URLs ...

    各浏览器对ES6的支持 https://blog.csdn.net/lpw_cn/article/details/84789183 http://kangax.github.io/compat-tab ...

  6. C#调用Microsoft.DirectX.DirectSound问题记录及解决

    问题1:初始化结构体WaveFormat或其他变量时卡死 修改App.config,修改方法如下: 原App.config <?xml version="1.0" encod ...

  7. Python模拟ICMP包

    主要使用Scapy来完成 基础环境 VM1(192.168.1.226) | | VM2(192.168.1.125) vm1封装icmp包发给vm2 vm1脚本: #! /usr/bin/env p ...

  8. 22 pycharm如何将一段代码同时向左缩进一个tab键

    在使用pycharm时,经常会需要多行代码同时缩进.左移,pycharm提供了快捷方式 1.pycharm使多行代码同时缩进 鼠标选中多行代码后,按下Tab键,一次缩进四个字符 2.pycharm使多 ...

  9. 20175208 《Java程序设计》第六周学习总结

    20175208 <Java程序设计>第六周学习总结 一.教材知识点总结: 第七章 1.内部类: 成员内部类.静态嵌套类.方法内部类.匿名内部类 .(1).内部类仍然是一个独立的类,在编译 ...

  10. animate.css 动画的使用

    $('#animatedClose').removeClass().addClass('fadeInDownBig animated').one('webkitAnimationEnd mozAnim ...