我想知道我是否应该在我的HTML5画布游戏中实现CSS3转换或画布转换(旋转,倾斜,缩放...现在主要在2D上)。
我打算在android上使用它来制作chrome
我无法找到任何确定的答案
每个的性能提升和整体利弊是什么?
答案 0 :(得分:3)
这取决于目的。
如果您使用CSS3转换,它只会影响画布元素而不影响其内容(位图),而使用画布自己的转换会影响内容。
另一个区别是CSS3转换会影响画布及其当前位图 over-all ,没有区别。使用画布上下文的局部变换,您可以更改每个绘制之间的变换矩阵,从而以不同的方式影响不同的形状。
如果您不需要在画布中对不同形状进行单独转换,并且您不需要提取像素来分析/操作转换后的内容,那么CSS3可能是更好的选择。
我相信浏览器共享相同的转换过程(核心),因此性能本身没有区别(理论上)。使用canvas本地转换仍有性能损失,但由于JavaScript本身,而CSS3转换在本机编译代码内部调用。
与为每个转换设置CSS规则相比,Canvas可以为您提供更好,更简单的细节控制。
使用画布'变换的缺点是读取例如相对于元素而不是变换后的位图的鼠标位置。这意味着您需要使用逆矩阵来补偿这一点。你可以通过使用绝对变换而不是为每次帧更新设置和重置的累积变换来解决这个问题。
我的建议:对于游戏使用画布通常更好。你可以只使用CSS制作更简单的游戏,但我会推荐这些东西的画布。
(免责声明:我在答案中假设你的意思是画布的内容,而不是一般的。)