太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es)
本文遵循“署名-非商业用途-保持一致”创作公用协议
requestAnimFrame(tick);
此命令是 HTML5 中新增的用于替换定时器触发更新的命令，以实现动画更新，其后台实现有一特殊之处。是将页面上的动画进行合并再呈现。提供了非常高的运行效率，且当当前页面标签离开未展如今屏幕上时。其自己主动暂停。
最好还是试一试，打开一个 html5 的三维演示样例，展现的过程中，CPU 风扇在几分钟后会狂转不止；但将页面标签切换到其他页面，再过几分钟。CPU 风扇明显降速。发热也没那么大了。
只是还不清楚是 CPU 还是 GPU发热，假设能找一部台式机来測试。打开机箱盖子，摸一下两者的散热片温度前后变化应该就能非常清楚了，或者用温度监測软件也能够查得到。
moonAngle 和 cubeAngle 是两个用于视图模型转换时使用的视角的变化值，这里通过动画更新，使其随时间的流逝，发生一定角度的旋转，以达到动态更新旋转的展示目的。
当仅保留 drawScene(); 这一句时。并不会呈现出内容来。而 animate(); 仅用于更新旋转角度。能够不考虑，那么 requestAnimFrame(tick); 这一句可能是确保其显示的一个必要条件；
然而。requestAnimFrame(tick); 在我的理解中。它仅用于触发运行 tick(); 方法本身。怎么会有这样致命的影响呢？
或许资源的延迟载入。可能须要定时刷新以达到更新各状态的最新结果吧。
这是否对于静态显示来说，资源消耗过大呢？又或者，我们能否够以还有一种方式，即载入完毕触发的方式来考虑这个问题进行解决呢？
那么 JS 或许能够有这种功能吧！
或许 JQuery 对 JS 事件的封装可能会非常好的解决这些问题。有待进一步研究，后文续补。
var lastTime = 0;
function animate() {
var timeNow = new Date().getTime();
if (lastTime != 0) {
var elapsed = timeNow - lastTime;
moonAngle += 0.05 * elapsed;
cubeAngle += 0.01 * elapsed;
}
lastTime = timeNow;
}
function tick() {
requestAnimFrame(tick);
drawScene();
animate();
}
function webGLStart() {
var canvas = document.getElementById("lesson13-canvas");
initGL(canvas);
// 清屏并启用深度測试
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.enable(gl.DEPTH_TEST);
initShaders();
initBuffers();
initTextures();
tick();
}