"html中动态创建的canvas元素VS静态canvas标签（在模拟多层的情况下）"

Question

在这里，我实际上是在谈论性能问题。<\/strong>

我已经对在 html 画布项目中创建图层进行了一些研究，我在大多数 tuts 中发现，他们只是告诉我写很多静态 html 画布标签，然后从每个标签中获取上下文（然后使用 css \/ 绝对位置\/z-index 来模拟​​层的顺序）。

但我想知道这种方式是否更好：

1. 在 html 中只写一个画布标签（我们称之为background canvas<\/code> ）。<\/li>
2. 使用createElement<\/code> api 为每个图层创建其他画布元素，但不将它们附加到 DOM 中。<\/li>
3. 从这些“虚拟”画布（动态创建）中获取上下文<\/li>
4. 使用 canvas api 在这些“虚拟”画布上绘制东西。<\/li>
5. 使用requestAnimationFrame<\/code>和drawImage<\/code>将每个“虚拟”画布绘制到background canvas<\/code>上<\/li><\/ol>

   实际上，我认为动态创建的画布对我来说更容易接受\/更灵活，但是我在画布性能优化方面没有很多经验（这就是我在这里的原因）。

   我想我需要一些关于如何测试这两种情况的性能的指南，或者如果有人在这里有任何建议，我们将不胜感激。