对于web前端从业者来说，目前的技术更新迭代的很快，能做到现在已经很不容易了，但是既然要做，就要做好，如果你知道浏览器是如何渲染页面的，那么会加深你对网页的理解，反正我是看完了
浏览器渲染页面过程
用户输入网址，浏览器向服务器发出请求，服务器返回html文件；
浏览器开始载入全部的html代码，发现标签内有一个标签引用外部CSS文件，浏览器又发出CSS文件的请求，服务器返回这个CSS文件；
浏览器继续载入html中部分的代码，并且CSS文件已经拿到手了，开始边解析DOM变渲染；
浏览器继续执行时，发现刚刚请求的图片文件返回了，由于图片占用了一定面积，影响了后面段落的排布，因此浏览器需要回过头来重新渲染这部分代码；
浏览器发现了一个包含一行Javascript代码的标签，赶快运行；
浏览器发现了两个个包含外部引用的标签，请求并运行，发送了第一个js请求之后不是阻塞，而是会继续发送第二个JS的外部链接请求，结果出现了意外，第二个js的内容先返回了，这时候浏览器不会执行第二个js的代码，而是会等第一个js的代码返回执行后才执行第二个js的代码；
浏览器发现了一个外部标签，但是包含了async属性，说明是一个异步请求的js，发送请求但是不必等返回执行；
在Javascript中，脚本执行了这条语句，它命令浏览器隐藏掉代码中的某个
（style.display=”none”）。杯具，突然就少了这么一个元素，浏览器不得不重新渲染这部分代码；终于等到了的到来，这次渲染终于完成了，触发DOMContentLoaded事件（jQuery中的$(document).ready();方法）。
等待所有的图片资源、异步加载的JS文件请求完成了，浏览器赶紧触发了onload事件。
--
来源：切图网（www.qietu.com）。转载请注明，谢谢！
网友评论