我们需要使用<canvas>自己实现双缓冲吗？

Question

我开始使用Canvas（与GWT一起），我们需要自己实现双缓冲吗？想知道浏览器是否已经为我们实现了这个功能。谢谢。

- user291701

Answer 1

你绝对不需要自己实现双缓冲，这样做会浪费时间和性能。

幸运的是，每个画布实现都在后台为您实现了它。

以下是一个简单的示例：http://jsfiddle.net/HYVLj/

- Simon Sarris

---

是的，当我发现这个问题的答案时，我也感到非常宽慰。谢谢你提出这个问题，这样未来的人们也能找到答案！ - Simon Sarris

错误。考虑观看http://www.youtube.com/watch?v=Prkyd5n0P7k，实现它，进行自己的定时测试，并自行决定是否提供额外的性能。 - sws

@sws 你能提供一个比50分钟视频更简洁的例子吗？这样可以节省时间，以确定你的说法是否正确（或者视频是否支持你的说法）。到目前为止，我看过的所有实时测试都没有表明手动双缓冲画布会以任何方式提高性能。 - Simon Sarris

@Simon Sarris，你能提供一份在线测试链接列表来反驳双缓冲不会提高性能的说法吗？视频提供了时间、数字和如何运作的讨论。除了我重新观看视频并为您编写文本之外，这是来自可靠来源（Google开发人员）的信息，他正在讨论遵循特定编程范例所获得的性能增益，该范例自Mode 21h以来就存在。自己进行研究，您将不会对结果感到不满意。 - sws

嗯...你的正方形示例在Google Chrome桌面版和移动版上都按预期工作。但是，由于某种原因，我的应用程序没有按预期工作，尽管我使用了requestAnimationFrame()：Matematika 3。很抱歉，您可能无法理解该语言 - 只需等待应用程序加载并单击任何标题即可。在移动设备上，箱子位图的闪烁将清晰可见（即使在旗舰三星Galaxy S7 Edge上也是如此），但在桌面版本上则不会。 - adlabac

Answer 2

我知道这是一个相当老的线程，但我想指出Simon Sarris答案中的Fiddle似乎是错误的。当我在Google Chrome上尝试它时，在第10和11行之间（循环之前）插入了一个alert语句，然后方块就消失了，只有在关闭警窗口后才重新出现。似乎循环没有正确执行。也许JavaScript对其进行了优化。无论如何，我认为没有进行双缓冲。如果我错了，请纠正我。

- Kim Lavoie

---

通过添加警报，您是否可能给浏览器提供了在画布上绘制的选项？因为就它而言，脚本已停止执行？我不确定警报在何时将控制权交还给浏览器渲染序列的其他部分。 - Gabriel L.