-
传统opengl程序 使用了两个颜色缓冲区:”前台“和”后台“。
前台对应屏幕,后台是程序实际渲染的目标,一帧后会切换两者。
常用函数:
glutSwapBuffers()
eglSwapBuffers() -
webgl 由于运行在浏览器中,作者原文说浏览器会自动侦测到绘制操作并在屏幕上显示。
- 刷新函数的不同,才是导致两者的实现差异。
传统opengl运行在window、mac、android下,都有一个主循环,类似:
while (true) {
EventDispatch(); //鼠标 键盘事件派发
MainLoop(); //主业务
Draw(); //渲染
SwapBuffer();
}
在一帧内可以无限循环 一般通过事件控制每次循环的节奏
比如:win下会将事件处理完
-
而浏览器的驱动方式大不相同:
通过时间间隔回调的方式 每秒60帧
所以浏览器中没有必要使用两个颜色缓冲区 每次回调时刷新一次即可
还是有疑问?
什么时候刷新 调用前/后 怎么判断这个函数的调用就是用来刷新帧缓冲的?
作者原文:
js执行结束后 浏览器会对颜色缓冲区检查 若被修改过则同步到屏幕上
还有一种是浏览器事件触发导致的调用 也会在函数执行完后 交回给浏览器
理解扩展:
第一次加载完 所有js执行一遍后 会检查一次 后面通过frame驱动的调用 每次执行完 也会检查一次 事件驱动的部分 会不会打乱渲染节奏?
应该不会 因为浏览器是单线程的 前一次的函数执行完才会触发事件函数新疑问:
若有多个frame驱动函数 每个都会检查?? 一般游戏的主循环只会有一个!!requestAnimationFrame(step); if (!window.requestAnimationFrame) { window.requestAnimationFrame = (function() { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) { window.setTimeout(callback, 1000/60); }; })(); }
注意:
alert() confirm() 函数会将控制权中途交给浏览器 导致提前刷新出缓冲区的内容
所以要小心这类函数