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. HDU 3586 二分答案+树形DP判定

    HDU 3586 『Link』HDU 3586 『Type』二分答案+树形DP判定 ✡Problem: 给定n个敌方据点,1为司令部,其他点各有一条边相连构成一棵树,每条边都有一个权值cost表示破坏 ...

  2. Sublime 个人常用快捷键

    Sublime 个人常用快捷键 Hot Key Alt + F3 选中文本所以有相同项;同多次Ctrl + D Ctrl + L 选中整行,继续按可继续选 Ctrl + Shift + M 选择括号内 ...

  3. winrar目录穿越漏洞

    地址: 参考: https://research.checkpoint.com/extracting-code-execution-from-winrar/ POC: https://github.c ...

  4. servlet中如何实现通过Spring实现对象的注入

    @WebServlet("/BaseServlet")public class BaseServlet extends HttpServlet { private static f ...

  5. cygwin vim can't write .viminfo

    问题 每次退出vim时,都提示 vim can't wirte .viminfo 运行环境 以管理员身份登录win7,并运行cygwin 排查过程 切换到家目录,查看发现.viminfo文件存在. 查 ...

  6. RNA-seq标准化

    你的 heatmap 可能用错数据了 (组间表达量标准化) http://www.genek.tv/article/24 RNA-seq的标准化方法罗列 https://www.jianshu.com ...

  7. XGBoost 与 Boosted Tree

    http://www.52cs.org/?p=429 作者:陈天奇,毕业于上海交通大学ACM班,现就读于华盛顿大学,从事大规模机器学习研究. 注解:truth4sex  编者按:本文是对开源xgboo ...

  8. 【JavaScript】数组

    [声明一个数组]var a=[1,1,1]; [定义数组的长度]var a=new Array(2); [特殊数组]arguments[0][可以不用声明,当数组内没有东西时可以直接通过方法的参数自动 ...

  9. maven配置国内阿里云镜像

    <mirrors> <mirror> <id>alimaven</id> <mirrorOf>central</mirrorOf> ...

  10. CCF CSP 201709-1 打酱油 （贪心）

    题目链接:http://118.190.20.162/view.page?gpid=T63 问题描述 试题编号: 201709-1 试题名称: 打酱油 时间限制: 1.0s 内存限制: 256.0MB ...