浏览器工作原理相关笔记

宏观来看,浏览器的工作流程是:
发送请求——(服务器响应,返回各种资源)——对返回的资源进行解析渲染,生成页面——将生成的页面展现给用户
 
其中,解析渲染是核心,解析渲染的过程是:
首先,渲染引擎开始解析HTML,将标签转化为dom树中的dom节点。
接着,它解析CSS文件及style标签中的各种样式信息,将这些样式信息对应先前解析好的dom树构建另一颗树——render树。
然后,对render树上的各个节点进行布局,确定每个节点在屏幕上的确切坐标。
最后,遍历render树上个各个节点,对其进行绘制。
 
需要注意的是:为了更好的用户体验,渲染引擎会尽可能早的将内容呈现到屏幕上。也就是解析完一部分内容就显示一部分内容,同时还可能在下载其余的内容。(使用浏览器的时候会发现,有时页面会一部分一部分慢慢显示出来;有时候页面布局结构出来了,图片还在加载,没能显示)
 
关于脚本解析:
web的模式是同步的,开发者希望解析到一个script标签时立即解析执行脚本,并阻塞文档的解析直到脚本执行完。如果脚本是外引的,则网络必须先请求到这个资源——这个过程也是同步的,会阻塞文档的解析直到资源被请求到。这个模式保持了很多年,并且在html4及html5中都特别指定了。开发者可以将脚本标识为defer,以使其不阻塞文档解析,并在文档解析结束后执行。Html5增加了标记脚本为异步的选项,以使脚本的解析执行使用另一个线程。
原文地址:https://www.cnblogs.com/czf-zone/p/3202342.html