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. docker 标记和推送镜像

    打开Launchpad并定位到docker Quickstart Terminal图标. 点击Docker Quickstart Terminal图标, 打开一个窗口. 将光标定位到Docker Qu ...

  2. Grunt搭建自动化web前端开发环境--完整流程

    Grunt搭建自动化web前端开发环境-完整流程 jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前 ...

  3. SecureCRT通过密钥登录(网上也有很多教程,但是有些不详细,此教程本人亲测)

    1.先打开SecureCRT,标题标--工具---创建公钥,如图: 2.点击创建公钥,弹出选项点下一步 3.继续点下一步: 4.继续点下一步: 5.继续点下一步(密钥长度默认1024即可),生成密钥需 ...

  4. 棋盘游戏，dfs搜索

    问题描述 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大小的棋盘,摆放k个棋子的所有可行的摆 ...

  5. 极致21点开发DAY3

    今天完成的主要任务是活动窗口的显示与关闭,以及领取金币的逻辑.用到了数据持久化技术.我想记录的主要是领取金币的逻辑. 领取金币算法:如果今天没有领取金币,即可领取,否则什么都不做. 一句话描述足矣,但 ...

  6. Intel Code Challenge Final Round (Div. 1 + Div. 2, Combined)

    C 模拟 题意:给的是一个矩形,然后√2 的速度走,如果走到边上就正常反射,走到角上,暂停反射,我们知道要不循环要不暂停,记录走到的点最短时间 /*************************** ...

  7. 微信不支持App下载的解决方案 微信跳转打开外部浏览器下载（苹果跳转商店下载）

    在微信中,打开app下载链接,或者使用微信扫一扫app下载二维码,都是无法下载app的. 因为腾讯为了自身利益,屏蔽了其他app直接在微信中下载.下面给分享下,找到的2种有效的解决方案. 方案:点击链 ...

  8. VScode中运行python程序，使用Code Runner插件

    把我的py文件加载在里面,想要运行一下. 可是...没有动静 于是我又到网上去查,原来要配置tasks.json,可我照着网上的方法弄好后还是没法运行,于是我便投入了code runner的怀抱 co ...

  9. 安卓自定义TextView实现自动滚动

    xml文件代码 <com.mobile.APITest.ScrollEditText android:id="@+id/statusEditText" android:lay ...

  10. 顶尖 API 文档管理工具 (Yapi)

    原文地址:https://www.jianshu.com/p/a97d2efb23c5