JS动画
缺点
(1)代码的复杂度较高；
(2)JavaScript在浏览器的主线程中运行，而主线程中还有其它需要运行的JavaScript脚本、样式计算、布局、绘制任务等，对其干扰导致线程可能出现阻塞，从而造成丢帧的情况。
优点
(1)JavaScript动画控制能力很强, 可以在动画播放过程中对动画进行控制：开始、暂停、回放、终止、取消都是可以做到的；
(2)动画效果比css3动画丰富，有些动画效果，比如曲线运动,冲击闪烁,视差滚动效果，只有JavaScript动画才能完成；
(3)CSS3有兼容性问题，而JS大多时候没有兼容性问题。
CSS动画
缺点：
(1)运行过程控制较弱，无法附加事件绑定回调函数。
CSS动画只能暂停,不能在动画中寻找一个特定的时间点，不能在半路反转动画，不能变换时间尺度，不能在特定的位置添加回调函数或是绑定回放事件,无进度报告。
(2)代码冗长。
想用 CSS 实现稍微复杂一点动画,最后CSS代码都会变得非常笨重。
优点
(1)制作方法简单方便。
只需确定第一帧和最后一帧的关键位置即可，两个关键帧之间帧的内容由Composite线程自动生成，不需要人为处理。当然也可以多次添加关键帧的位置。
因为只设置几个关键帧的位置，所以在进行动画控制的时候时比较弱的。不能够在半路暂停动画，或者在动画过程中不能对其进行一些操作等。
(2)css3在实现一些简单的滑动，翻转等特效的时候会很方便，但是想要做到一些酷炫的效果的时候，其操作往往可能会比js操作有更多的冗余。
(3)css3在做动画的时候，浏览器可以对其进行一些优化，会比js使用更少的占用cpu资源，但是效果足够流畅。
网友评论