chorme浏览器的工作原理

主要分为 输入url获取资源、依靠获得的资源渲染页面。

1.输入url，执行DNS查询，与服务器建立连接。

2.获取服务器响应回来的响应信息及资源。

3.依靠服务器传来的html资源，渲染dom tree。与此同时将获取到的css资源解析为Style Rules，两者再合成渲染树(render tree)。ps:display:none的元素会出现在dom树上，而不会出现在render树上。伪元素相同。

4.遇到<scprit>标签会暂停html和css的渲染和解析，去加载js的代码（因为js的代码中可能有改变dom树结构的代码片段，诸如 document.write()等方法），所以我们在内嵌程序中要将<script>标签放在<body>标签的后面。

5.构建好了render树之后，浏览器就开始在页面中绘制各种元素了。我们就可以看到完整的页面了。

 

更详细的说明在https://zhuanlan.zhihu.com/p/47407398中。谢谢这位大神的分享。

 

posted @ 2021-03-16 01:33  可口better百事  阅读(151)  评论(0)    收藏  举报