浏览器输入 url 到页面展示完整的过程

浏览器输入 url 到页面展示完整的过程大致可以分为三步:

  1. 网络请求
  2. 解析
  3. 渲染

下面进行以上三步进行简单的赘述

网络请求

  1. 建立 DNS 域名解析;
  2. 建立 HTTP 连接(即 tcp 三次握手四次挥手);
  3. 向服务器发送请求
  4. 接收到服务器返回的数据,得到 HTML 源代码;
  5. 继续请求静态资源(DNS->HTTP->响应),直到资源请求完成;

解析:字符串解析成结构化数据

  1. HTML --》 DOM tree
  2. CSS --》 CSSOM tree
  3. 两者结合形成 render tree

渲染:Render tree 绘制到页面

  1. 计算各个 DOM 的尺寸、定位,最后绘制到页面;
  2. 遇到 JS可能会执行
  3. 异步 CSS、图片加载 等可能会触发重新渲染(重排);

解析、渲染不能同时进行。

你可能感兴趣的:(前端,javascript,前端,html)