从输入 url 到页面渲染完毕,发生了什么

  1. 用户输入 www.baidu.com
  2. 浏览器通过 DNS,把 url 解析为 IP
  3. 和 IP 地址建立 TCP 链接, 发送 HTTP 请求
  4. 服务器接受请求,查库,读文件等,拼接好返回的 HTTP 请求
  5. 浏览器收到首屏 html,开始渲染
  6. 解析 html 为 dom
  7. 解析 css 为 css-tree
  8. dom + css 生成 render-tree 绘图
  9. 加载 script 的 js 文件
  10. 执行 js

三个主要过程

  • DNS 解析
  • TCP 连接
  • HTTP 请求/响应

浏览器时如何对页面进行渲染的?
a. 解析 html 文件构成 DOM 树
b. 解析 css 文件构成渲染树
c. 边解析,边渲染
d. JS 单线程运行,JS有可能修改DOM结构,意味着 JS 执行完成前,后续所有资源的下载是没有必要的,所以JS是单线程,会阻塞后续资源下载。

你可能感兴趣的:(从输入 url 到页面渲染完毕,发生了什么)