浏览器对文档的解析过程

我们输入一个url之后,浏览器从发起请求到页面显示做了什么?

比如我在url输入www.baidu.com
在这里插入图片描述
首先浏览器要调用资源加载器,他既需要要和网络模块对接又需要和解析器对接,所以我们可以把它看成一个仓库

最先返回来的资源是百度的文档类型,所以会被html解析器要去

html解析器得到之后他把它变成dom树(多层次的节点对象),我把他想象成一个车架子。

在解析过程会遇到link这类标签,他们需要引入外部资源,如果是css这需要使用css解析器,这和文档解析过程是同步的

在解析中会遇到script,img这类需要引入外部资源还要进行dom节点的替换,所以html解析过程就被阻塞了(当然js可以设置为异步形式)。

当一个dom树构建好了,就像一台车安装了轮胎玻璃这些基本功能,当然一台车还要专注于美观。

所以css解析的内容被添加到了dom树上生成了RenderObject树。

但上面的内容都可以看做是设计师的蓝图,具体的实现还得经过布局计算生成RenderLayer+渲染上下文(相当于给你的车上色)。

最后由于我们的页面是动态运行的,用户会和页面不断交互,所以页面不断重复进行渲染工作

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值