158   CSS HTTP JS

一,浏览器生成页面的过程:
1,解释 HTML,生成 DOM
2,解释 CSS,生成 CSSOM,
3,DOM 和 CSSOM 合成 Render Tree
4,根据 Render Tree 计算每个节点的位置
5,最后将节点进行布局,生成页面
 
二,页面生成过程的注意事项:
1,如果需要加装 CSS 文件,会中断 HTML 解释
2,JavaScript 可能修改 DOM 和 CSSOM ,导致页面渲染中断或者重新渲染
三,页面生成优化的建议:
1,HTML和CSS编写要符合规范,有开始和结束标志,避免不规范的语法导致渲染过程耗时变长
2,CSS文件放在前面,即head里,避免HTML生成DOM时出现CSS网络请求,导致页面卡住
3,CSS选择器尽量简短,否则遍历CSSOM的查询会耗时很长
4,JavaScript放到最后加载,即body后面,避免JS文件加载而中断页面渲染
5,尽量减少JavaScript修改HTML和CSS,会导致页面重复渲染



Leave a Reply

Your email address will not be published. Required fields are marked *