zoukankan      html  css  js  c++  java
  • CSS3的动画为什么效率高?

    最本质的因素不是因为是浏览器内核用原生去帮你实现运动动画,而是因为使用了transform的。这使得不会对dom树进行重排,导致了效率高的原因,但是很多的博客也好,都忽视了这一点,而一味的去吹捧了,CSS3的就是高。

    而如果你没有认清这一点,使用CSS3来写易起秀那种H5的页面的时候,你只会像以前一样的去使用position,然后去改变top,left等,然后在使用一个过渡(transition),这样其实依然是会引起dom树重排的,而Web开发中,动画之所以效率低,也正是因为dom树重排导致。

    当然如果你使用,position: absolute; 的时候,效率也许也还行,这是因为当 position 的值为 absolute、fixed 的时候,属于层模型,它会脱离原来的文档流,也就是脱离原来的树,如果改变它的宽、高啊等等导致重排的话,只会是在它自己身上发生不回冒泡到整个文档,但是依然还是有重排。

    所以无论怎么实现,要想动画效率高,和CSS3是没有关系的,本质是要让dom树别重排。而CSS3中出现的改变transform的值不回引起重来,所以CSS3效率高。CSS3的animation就更不用讲了,它肯定不回引起重排,但是开发起秀那种H5的页面可能不太合适就是了。

    原文地址

  • 相关阅读:
    委托、事件入门(转)
    ArcToolBox——Clip 批量处理
    Geometry 对象浅析 ( 作者:Flyingis)
    AE数据加载
    ADO.NET 的最佳实践技巧(转)
    android调用.net wcf 服的方法
    winform调用dos命令
    变位词实现 编程珠玑一处错误
    元素翻转
    80X86学习笔记转移指令
  • 原文地址:https://www.cnblogs.com/iron-whale/p/css_xiaolv.html
Copyright © 2011-2022 走看看