尽量避免使用float(浮动)和position:absolute/fixed

一直误以为position的效率比float低，并在之前的一个项目大量应用float并使用了许多float相关的奇技淫巧，上线后发现页面速度并不理想，当时以为是该产品UI设计比较复杂，图形太多的缘故，并没有想太多，这次开始新项目，强制要求8秒载入，痛心疾首要对产品的加载速度做优化，前端页面自然首当其冲，这时忽然想到比较一下float和position的性能，简单改了下以前的一个<a
href="http://www.moonless.net/demo/9/">例子</a>，测试方法是载入53100个同级div，分别设以不同的样式，用onload看载入时间，以下是测试结果：
position:static 2.012秒
position:relative 2.124秒
position:absolute 191.422秒
position:fixed 187.606秒
float:left 未响应……

display:inline-block 31.221秒
faint...
我猜到了大约情况，却没料到是这样的结局，自我反省中……

<a href="http://www.moonless.net/demo/9/haslayout.zip">演示下载</a>

顺便赞一下chrome，比firefox快不是一点半点；
另外，以上测试在IE中除了float:left，均在3秒左右，IE中如果使用{float:left:clear:both}，不会出现未响应，载入在30秒以内

收藏到网摘：新浪VIVI  365Key  POCO网摘  和讯网摘  我摘