Repaint 跟踪浏览器的渲染

 

前端优化,从很久就开始了。随着研究的深入,关注的点就越来越多。最近也有不少的前端开发同学在研究浏览器的Reflow和Repaint . 引用以为Yahoo前端开发工程师的分析

 

repaint(重绘)是在一个元素的外观被改变,但没有改变布局的情况下发生,如改变visibility、outline、前景色。
"According to Opera , repaint is expensive because the browser must verify the visibility of all other nodes in the DOM tree."
当repaint发生时,浏览器会验证DOM树上的所有其它结点的visibility属性。
 
reflow(回流)是导致DOM脚本执行低效的关键因素之一。页面上任何一个结点触发reflow,都会导致它的子结点及祖先结点重新渲染。
 
 
而 Firefox 3.5 给我们提供了一个很好的观察 Repaint 的接口 MozAfterPaint. 通过这个事件,我们可以看到我们网页的渲染情况是如何,这样会给我们分析reflow带来帮助。
 
下面的例子需要 firefox 3.5 beta



[本日志由 puterjam 于 2009-05-04 00:48 AM 编辑]
上一篇: opera 15岁了
下一篇: 跟踪浏览器重绘结果的脚本
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags: Firefox repaint reflow
相关日志:
评论: 2 | 引用: 0 | 查看次数: -
臻臻[2009-05-31 10:25 AM | | | 119.145.134.34 | del | 回复回复]
测试一下。
叶子呀啊[2009-05-05 01:39 PM | | | 218.207.140.18 | del | 回复回复]
很强的技术~~~
发表评论
昵 称:
密 码: 游客发言不需要密码.
邮 箱:
网 址: 输入网址便于回访.
内 容:
验证码:
选 项:
虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号.
字数限制 500 字 | UBB代码 开启 | [img]标签 关闭