requestAnimationFrame

Javascript 中可以通过定时器 setTimeout 和setinterval来实现

但是这两种定时器的实现并不精确，会受到其他定时器的影响，setTimeout 任务被放进了异步队列中，只有当主线程上的任务执行完以后，才会去检查该队列里的任务是否需要开始执行，因此这两种定时器的实际执行时间通常都会晚于设定时间。这样的后果就是可能会出现掉帧。

推荐使用requestAnimationFrame实现定时重绘，在项目初始化时设置requestAnimationFrame

/*[IF-SCRIPT_BEGIN]
Browser.window.requestAnimationFrame(loop);
function loop():void{
    try{
        Laya.stage._loop();
    }finally{
        Browser.window.requestAnimationFrame(loop);
    }
}
/*[IF-SCRIPT_END]*/

//_loop为自定义重绘

 requestAnimationFrame默认返回一个id，通过这个ID可以停止指定的requestAnimationFrame

//创建requestAnimationFrame
var id = requestAnimationFrame(loop);
//停止指定ID的requestAnimationFrame
cancelAnimationFrame(id)

requestAnimationFrame的优势

1、由系统来决定回调函数的执行时机。把每一帧中的所有DOM操作集中起来，在一次重绘或回流中就完成。如果屏幕刷新率是60Hz,那么回调函数就每16.7ms被执行一次，如果刷新率是75Hz，那么这个时间间隔就变成了1000/75=13.3ms。requestAnimationFrame的步伐跟着系统的刷新步伐走。它能保证回调函数在屏幕每一次的刷新间隔中只被执行一次，这样就不会引起丢帧现象，也不会导致动画出现卡顿的问题

2、在隐藏或不可见的元素中，requestAnimationFrame将不会进行重绘或回流，而setTimeout 仍然在后台执行动画任务，对于不可见元素，完全没必要浪费多余的性能进行重绘。因此相对而言，requestAnimationFrame消耗更少的的cpu，gpu和内存使用量。