本文讨论了HTML5 Canvas在绘制动态时钟等场景下可能存在的性能疑虑。通过对比实验，解释了Canvas动画与DOM动画的区别，并提出双缓冲技术可以减少页面闪烁，但在大量图形运动时，其性能提升效果并不显著。建议读者尝试双缓冲技术以优化Canvas绘制性能。
回复内容：
个人觉得没有性能的问题
不会有任何性能问题，要理解canvas是比较底层的API，它需要手工去做一些底层的工作，让canvas里的东西动起来就需要不停的重绘，刚接触canvas的人会容易产生这样的误解，觉得这样会有性能问题
传统的DOM动画并不是没有这个重绘过程的，想要DOM元素动起来，一样需要经历重排版和重渲染，只不过这些浏览器的排版引擎在底层已经自动替你完成了，实际上浏览器重构整个渲染树的开销是非常非常巨大的，这也是造成DOM动画性能低下的原因，在canvas里可以让里面的数千个图形不断运动，依然保持流畅，而如果一个页面中有数十个DOM一起运动就已经开始卡了
不会吧，许多HTML5游戏引擎都是冲着60fps去的，做个打飞机之类的游戏也完全没有压力，时钟这种东西就更不至于造成性能问题了，更何况你是1fps。先做个实验试试吧。
一秒刷新都有性能问题的机器就别跑什么HTML5了。
对于CANVAS绘制性能提高问题，可以考虑使用“双缓冲”技巧。
CANVAS图像传统绘制是这个样子的：
(1)在可见画布上画出一个圆。
(2)在可见画布上画出一个三角。
(3)在可见画布上画出一个方块。
“双缓冲”技巧则是这个样子：
(1)在非可见画布上画出一个圆。
(2)在非可见画布上画出一个三角。
(3)在非可见画布上画出一个方块。
(4)将非可见画布上的内容一次性画到可见画布上。
也就是说，在浏览器上，使用双缓冲技术进行canvas对象的绘制只会对浏览器进行一次渲染。就理论而言，在需要绘制的东
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
