讨论一个关于js,canvas,setTimeout的问题.

最新推荐文章于 2023-06-07 17:18:47 发布

fins

最新推荐文章于 2023-06-07 17:18:47 发布

阅读量389

点赞数

分类专栏： web前端文章标签：游戏 JavaScript Blog ViewUI

web前端专栏收录该内容

85 篇文章

订阅专栏

本文讨论了一种关于JS和Canvas的优化方案：将updateLogic和drawCanvas分别放入两个setTimeout中执行，以提高FPS。文中提出了对该优化方案效果的质疑，并邀请读者一起探讨。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

想和大家讨论一个关于js,canvas,setTimeout的问题.

看一段伪代码:



function mainLoop(){

   updateLogic();  //该方法进行逻辑运算,处理要绘制的"图形"的坐标大小等.
   drawCanvas(); //该方法在一个canvas上绘制出"图形".

   setTimeout( mainLoop, 30); //30毫秒后 重复以上动作.
}

setTimeout( mainLoop, 30);

这段代码很好理解 ,每30毫秒更新一下图形的状态并绘制.
它也是很多游戏或者是动画程序的主干.

网上看到有人提出一种优化方案.
方案中建议将此代码中的
updateLogic 和 drawCanvas 分别放到两个 setTimeout里去执行 ,
说这样能够优化程序的性能, 使其能够得到更高的FPS(每秒钟显示的帧数).

我觉得这种优化的效果微乎其微甚至到底会不会起到真正的优化我个人也持怀疑态度.

各位爱好js的同学们大家一起讨论一下

你们是怎么看的?

补充: 大家在讨论时要注意一下 canvas对象的特殊性(可以简单参考一下[url="http://fins.iteye.com/blog/622493"]这里[/url]. 如果把drawCanvas换成普通的运算函数这个问题就没啥可讨论的了.