canvas和css实现同一个动画哪一个性能好

html-css015

canvas和css实现同一个动画哪一个性能好,第1张

这个是一个伪命题。

你举的例子并不确切,换句话说你并不是因为要做一个平移的的动画而考虑应该用css还是canvas。

css3动画很丰富,并且浏览器支持度相对已经很好了。再加上css3可以使用gpu加速,性能上已经很好了(如果使用得当的话,我已经不知道看过多少使用不当而认为css动画性能差的例子)

当然canvas也有很多错误使用,导致性能变差

而canvas个人认为更适合像素级别的绘制。这是css无法做到的。

canvas有专门的画布,其并不急于dom,因此性能上和css3会有一点不同,有时候canvas动画会更平滑。

有人做过测试, canvas和css3动画其实在不同场景各有优略。

简单解释一下: CSS更像是把多个“矩形”(div)裁剪后,然后拼接成一个图案,然后给图案上色。 Canvas由点开始,延长无数个点,得到线,延长线之后得到一个面(三角形,圆形,矩形等等的图案面),然后给线或者面描边,上色。 CSS目前更像是小朋友的手工课,Canvas更像是用一支笔画图,不过画出来的图更加像能够控制大小的矢量图片。在面对曲线和更复杂图形的时候,Canvas比CSS更有办法。另外Canvas确定坐标位置的时候更加贴近常用到的数学思维方法。