浏览器渲染原理
1.客服端浏览器开始从用户向服务器发出请求,服务器响应的将如上HTML返回给请求的客户端浏览器中。
2.加载从标签开始,并发现标签内有个外部样式文件要加载
<link href="../css/css.css" rel="Stylesheet" type="text/css" />
3.这时客户端浏览器又向服务器发出一个请求加载css。css文件,服务器响应。
4.此时客户端继续加载html文件里面的标签,在css.css文件加载完后,同时开始渲染页面。
5.客户端浏览器在标签里发现一个标签并引用了服务器的图片,客户端浏览器又向服务器发出一次请求。而浏览器不会因为此时正在加载标签里的图片而停止等待图片加载完,浏览器继续渲染还未完成的部分。
6.标签里的图片加载完了,则要显示出来,同时图片会占有一定的内存,又会影响到后面的布局,浏览器不得不又回来重新渲染一次这部分。
7.总算把body里的标签加载及渲染完后,浏览器又发现了一段代码:
<script type="text/javascript" src="js/js.js"></script>
8.浏览器又立刻向服务器发出请求加载js.js文件,服务器响应。
9.浏览器又在js.js文件中发现了一段代码是让
标签隐藏的代码,此时浏览器又要重新去渲染被隐藏的
部分。
10.最后到浏览器发现了为止。