js优化

        要提高页面性能,其实就是避免reflow的开销。那么,有哪些方面是需要reflow的呢?比如,未指定图片宽高的话,图片的载入会使页面reflow, 因为要根据图片宽高来更新frame。这里就有一个提高页面性能的小技巧:如果事先能够确定图片宽高的话,最好在HTML里写上。

 

       在编写一些常见的动态效果时,一般使用CSS的display来切换可见性。很不幸,这也会产生reflow. 把元素置为display:none,相当于把这个元素的frame销毁了,再置回非none时,需要重新构造frame,这就产生了reflow. 而另外一个切换可见性的属性visibility则不存在reflow问题,置为visibility:hidden的元素的frame并没有销毁,需要显示的时候其实就是一个绘制(上面提到的动作第三步)过程而已,没有reflow,因此效率会更高。如果你看过一些JavaScript库/框架的源码,会发现它们大量使用visibility而不是display,道理应该如此。 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值