了解html页面的渲染过程以备学习前端的性能优化

最近在学习前端的性能优化,有必要了解一下页面的渲染流程,以便对症下药,找出性能的瓶颈所在。以下是我看到的一些东西,分享给大家。 参考:Understanding the renderer 页面的渲染有以下特点: •单线程事件轮询 •定义明确、连续、操作有序(HTML5) •分词和构建DOM树 •请求资源并预加载 •构建渲染树并绘制页面 具体来说: 当我们从网络上得到HTML的相应字节时,DOM树就开始构建了。由浏览器更新UI的线程负责。当遇到以下情况时,DOM树的构建会被阻塞: •HTML的响应流被阻塞在了网络中 •有未加载完的脚本 •遇到了script节点,但是此时还有未加载完的样式文件 渲