浏览器解析

用户代理的作用(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变化后,重新进行布局计算和渲染操作

   

    

    

  

  

      

猜你喜欢

转载自www.cnblogs.com/shadowsmile/p/10623372.html