浏览器解析

用户代理的作用（navigator.userAgent）

1.判断浏览器类型，采用兼容方案

2.判断是否为移动端

3.标识H5容器，方便调用H5容器特定接口

4.userAgent伪装成本很低，不能过于依赖

 

浏览器内核

　　作用：负责将表示页面的字符变成可视化的图像的模块

 

远程主机响应

HTTP协议

请求报文：

• 　　起始行：方法(GET)+ 空格 +请求url +空格 +http版本 +换行符
• 　　首部：首部名称：首部内容 换行符
• 　　首部结束：换行符
• 　　实体

 

 响应报文：

• 　　起始行：http版本 +空格 +状态码 +空格 +原因短语 +换行符
• 　　首部：首部名称：首部内容 换行符
• 　　首部结束：换行符
• 　　实体

 

渲染需要做的工作

重要组件：

• 　　html解释器：解释HTML文本的解释器  HTML文本->DOM树
• 　　css解释器：为DOM对象计算出样式信息
• 　　js引擎：解析js代码，使得js代码有调用DOM接口的能力
• 　　布局：结合css，计算出每个DOM对象的大小位置信息
• 　　绘图：将经过布局计算的DOM节点绘制成图像

渲染引擎

　　

 

思考：

　　浏览器如何处理外联资源呢？

　　　　1.查看是什么类型的外联资源

　　　　　　如果是网络资源，则需要通过资源加载器去进行加载,如果缓存在，则读缓存，否则去远程去取。取完后，在调用相遇的解释器去解释内容。

 

　　css放在头部，js放在body尾部，为什么要这样优化？

　　　　css不会阻塞页面渲染，但页面渲染到js后会放弃渲染，而执行js，所以js会阻塞页面渲染（因为js可能会修改DOM，所有页面停止渲染）

 

　　浏览器在渲染之前或之后还要做什么？

　　　　渲染之前需要加载资源，渲染之后在DOM或css变化后，重新进行布局计算和渲染操作

 

　　 

　　　　

 

　　　　

　　

 

　　

　　　　　 

 

转载于:https://www.cnblogs.com/shadowsmile/p/10623372.html