讲述浏览器解析渲染Web Page的文章:
http://taligarsiel.com/Projects/howbrowserswork1.htm
中文简述:
http://coolshell.cn/articles/9666.html
关于CSS编程:建立CSS Rule Tree是需要比照着DOM Tree来的。CSS匹配DOM Tree主要是从右到左解析CSS的Selector,好多人以为这个事会比较快,其实并不一定。关键还看我们的CSS的Selector怎么写了。
注意:CSS匹配HTML元素是一个相当复杂和有性能问题的事情。所以,DOM树要小,CSS尽量用id和class,千万不要过渡层叠。
Firefox中所谓的Frame就是一个DOM结点
Chrome下,Google的SpeedTracer是个非常强悍的工作让你看看你的浏览渲染的成本有多大
网页渲染要注意的概念是:Paint和Flow,这是浏览器在解析并执行js时对页面渲染用的动作描述。
参考资料: