JS动画:

  缺点:1.JS在浏览器的主线程中运行,而主线程还有其他的js脚本,样式布局,绘制任务等,对其干扰可能导致线程出现阻塞,从而造成丢帧的情况。

     2.JS动画代码复杂度高于CSS3动画。

  优点:1.JS动画控制能力很强,可以在动画播放过程中对动画进行控制,使其开始或停止。

     2.动画效果比CSS3动画丰富,有些动画只有JS动画才能实现,比如曲线运动,冲击闪烁等。

     3.CSS3有兼容性问题,而JS大多时候没有兼容性问题。

CSS3动画:

  缺点:

     1.运行过程较弱,无法附加绑定回调函数,CSS3动画只能暂停,不能在动画中寻找一个特定的事件点,不能在半路反转动画,不能变换事件尺度,不能在特定的位置添加回调函数或是绑定回放事件,无进度报告。

     2.代码冗长。想用CSS3实现稍微复杂一点的动画,最后CSS代码都会变得特别笨重。

  优点:

     1.浏览器可以对动画进行优化。

结论:

  如果动画只是简单的状态切换,不需要中间过程控制,在这种情况下,CSS3动画是优先选择方案。它可以让你将动画逻辑放在样式文件里面,而不会让你的页面充斥JS库。然而如果你在设计很复杂的富客户端界面或者开发一个有着复杂UI状态的APP,那么你应该使用JS动画,这样你的动画可以保持高效,并且你的工作流也更可控。所以,在实现一些小的交互动效的时候,就多多考虑CSS3动画,对于一些复杂控制的动画,使用JS动画比较可靠。  

CSS3动画与JS动画的优缺点?的更多相关文章

  1. css3动画与js动画的区别

    css与 js动画 优缺点比较   我们经常面临一个抉择:到底使用JavaScript还是CSS动画,下面做一下对比 JS动画 缺点:(1)JavaScript在浏览器的主线程中运行,而主线程中还有其 ...

  2. CSS3动画和JS动画的比较

    前言 之前有被问到一个问题,css3动画和js动画性能谁更好,为什么.据我的经验,当然觉得css3动画性能更好,至于为什么一时还真答不上来,所以特意查了一下资料总结一波. JS动画 优点: js动画控 ...

  3. css3 动画 vs js 动画

    之前被问到过,css3 动画与 js 动画孰优孰劣,脑袋的第一反应就是性能上肯定 css3 动画会好很多,但别人说不对,我就在想,不对?难道还有别的原因吗?答案是肯定的.先来看看二者实现动画的原理吧. ...

  4. 使用jquery封装的动画脚本(无动画、css3动画、js动画)

    自己封装好的showhide.js 包含无动画.css3动画.js动画 包括:fade(淡入淡出)  slideUpDown(上下滑动)  slideLeftRight(左右滑动)  fadeSlid ...

  5. Web高性能动画及渲染原理(1)CSS动画和JS动画

    目录 一. CSS动画 和 JS动画 1.1 CSS动画 1.2 JS动画 1.3 小结 二. 使用Velocity.js实现动画 示例代码托管在:http://www.github.com/dash ...

  6. 高性能Web动画和渲染原理系列(1)——CSS动画和JS动画

    [摘要] 介绍CSS动画和JS动画的基本特点,以及轻量级动画库velocity.js的基本用法. 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园 ...

  7. css3动画与js动画的一些理解

    http://zencode.in/19.CSS-vs-JS%E5%8A%A8%E7%94%BB%EF%BC%9A%E8%B0%81%E6%9B%B4%E5%BF%AB%EF%BC%9F.html 首 ...

  8. css动画与js动画的区别

    CSS动画 优点: (1)浏览器可以对动画进行优化.   1. 浏览器使用与 requestAnimationFrame 类似的机制,requestAnimationFrame比起setTimeout ...

  9. css动画和js动画的差异

    代码复杂度,js 动画代码相对复杂一些 动画运行时,对动画的控制程度上,js 能够让动画,暂停,取消,终止,css动画不能添加事件 动画性能看,js 动画多了一个js 解析的过程,性能不如 css 动 ...

随机推荐

  1. 使用tp访问数据库时提示错误: 'PDO' not found, 和not defined constant mysql_attr_init_command 和call an undefined function Think\Template\simpleXml_load_string()函数

    第一个问题: PDO not found 是因为 php没有安装pdo扩展, 无法提供给 php 以 数据库访问功能, 所以 报错是在文件: Think/Db.class.php的里面. 解决方法是: ...

  2. 20175312 2018-2019-2 《Java程序设计》第9周学习总结

    20175312 2018-2019-2 <Java程序设计>第9周学习总结 教材学习内容总结 已依照蓝墨云班课的要求完成了第九章的学习,主要的学习渠道是PPT,和书的课后习题. 总结如下 ...

  3. J2EE笔记

    J2EE的优势 J2EE允许公司把一些通用的.很繁琐的服务端任务交给中间件供应商去完成.这样开发人员可以集中精力在如何创建商业逻辑上,相应地缩短了开发时间.高级中间件供应商提供以下这些复杂的中间件服务 ...

  4. 好玩图像pil处理

    pil库的学习总结 #__author:'lwq'#date: 2018/11/15 from PIL import Image,ImageFilter,ImageDraw,ImageFont ### ...

  5. _string

    -- 游戏提示字符串设置-- 小技巧:可以修改游戏的自定义表相关提示符 1 |cFFF49B00[世界聊天]|r%s:%s2 |cFFFC5900[登录公告]|r|cFFFBF326欢迎%s登录创世魔 ...

  6. 外排序 External sorting

    2019-04-17 18:11:34 外排序(External sorting)是指能够处理极大量数据的排序算法.通常来说,外排序处理的数据不能一次装入内存,只能放在读写较慢的外存储器(通常是硬盘) ...

  7. Data Block -- Uncompressed

    Overview of Data Blocks Oracle Database manages the logical storage space in the data files of a dat ...

  8. 保密数据!泽宝曝光各个主要店铺收入 核心SKU数量少得惊人

    今年跨境电商圈的一大并购,上市公司星徽精密并购知名跨境电商大卖家泽宝股份正在进程中.星徽精密在向证监会行政许可项目审查回复中,披露了泽宝股份众多保密数据,揭开了泽宝股份众多经营关键点,值得跨境电商卖家 ...

  9. java,优先队列的用法

    像C++语言一样,java中,也有包装好的优先队列类PriorityQueue. 用法如下(模板代码): 工作安排问题: 问题描述:设有n件工作分配给n个人,将工作i分配给第j个人所需的费用为cij. ...

  10. JDK8下Object类源码理解

    JDK8中Object类提供的方法: package java.lang; /** * Class {@code Object} is the root of the class hierarchy. ...