从输入URL到页面渲染经历了什么？

2020 M12 22

  1. 协议补全，通常我们在地址栏输入的URL都不会手动补全协议名，而是交给地址栏自动完成。
  2. 如输入www.baidu.com,最终请求URL为https://www.baidu.com
  3. 网络进程：缓存存在直接返回，否则发送请求到服务端
  4. 发请求需要知道目标主机和端口号，http默认端口号:80,https默认端口号:443
  5. 主机和端口号从url获取，url可能是纯ip，也可能是域名
  6. 如果是域名，就进行dns域名解析，涉及dns缓存
  7. tcp三次握手(https协议会有tls建立连接)
  8. 解析url获取的ip端口号，浏览器端会构建请求行、请求头等信息，并把和该域名相关的Cookie等数据附加到请求头中，然后向服务器发送构建的请求信息。
  9. 报文解析http->tcp->ip... ... ip->tcp->http
  10. 服务器处理，构建响应报文 (响应行、响应头和响应体)
  11. 响应头包含location需要重定向处理
  12. Content-Type告知浏览器如何解析
  13. 解析html构建dom树
  14. 解析css为styleSheets，样式标准化：rgb,bold:700,根据继承和层叠计算dom样式
  15. 创建布局树(只包含可见元素)
  16. z-index,定位，浮动，分层，
  17. 绘制
  18. 栅格化处理
  19. GUI进程合成和显示
  20. 四次挥手，断开连接