我正在开发一个目前使用CSS3过渡构建的webapp（仅在Chrome 19+中运行）。更具体地说，我正在使用Jquery Transit来使用Jquery本身来激活CSS3动画。这里的推理是，一些动画被抽出几秒钟而jquery animate 不够流畅，但是Transit对此很有帮助。 Jquery Transit工作得很好，但我很好奇HTML5 Canvas是否会让事情变得更加平滑？如果是这样，是否值得追求，因为我目前正在为DIV使用AJAX和基于百分比的位置？如果有人知道CSS3动画如何与Chrome中的HTML5 Canvas性能相比，并愿意提供他们的意见，我将非常感激！
答案 0 :(得分：15)
CSS3将减少您的麻烦，您可以在将来轻松更改它，并且它可以在不支持画布的系统上正常工作。
如果你正在使用文字，你应该坚持使用CSS，如果你可以逃脱它。 Canvas会破坏应用程序的可访问性，并禁止用户使用克拉或突出显示文本或使用文本到语音。
如果您只是制作一个有趣的滑动按钮或其他东西，那么您也应该只使用CSS，因为它可能更容易实现和维护。重做CSS比滑过（可能很复杂的）JavaScript更容易。
我不能老实告诉你画布效果是否会更顺畅。画布的一个优点是，您可以将事物设置为看似更大的尺寸（同时保持画布大小相同），而不必使DOM重新布局。在大多数现代系统中，这确实不是一个问题。
此外，如果已经使用CSS3完成，您实际上是否存在性能问题？如果没有人抱怨性能，为什么还要为画布重写呢？如果您到目前为止没有遇到任何真正的性能问题，为什么要重新发明您的应用程序？
答案 1 :(得分：0)
我认为你可能遇到的问题是它是基于位图的。因此，在最初呈现页面之后放大和缩小将是一个问题。此外，线路中断可能会很痛苦。编写网站内容的人可能会发现插入换行符很有挑战性，因为没有使用canvas，svg或vml的换行符。实际上，您需要预先计算换行符。 “\ n”使用raphael.js有效，但效果不佳。此外，如果您使用svg图形，则无法使用选择器来定位各个部分。你也许可以使用帆布，也许...... Canvas可能有一堆相同的问题。
在图像正面，如果图像缩放，则会有模糊的图像，并且有较少的库可用于处理画布的图像大小调整。这可能会在未来发生变化，但仍然是一个难以应对的问题。我只是坚持你的divs / css3和旧版浏览器的jquery回退。
从纯粹的表现角度来看，查看您问题的第一条评论。它有一些不错的基准。