输入 URL 之后,发生了什么?

  • 将域名通过 DNS 解析为 iP 地址。
  • 建立 HTTP 协议会话。
  • 服务器处理请求。
    • 查询数据库
    • 查询缓冲
    • 返回响应
  • 浏览器处理返回的响应

浏览器怎么处理收到的响应?

  • 解析HTML,构建DOM 树。
  • 构建渲染树(将css样式与DOM对应起来)
  • 渲染树布局阶段(主要处理元素布局属性position,float,margin)
  • 绘制渲染树(处理元素内部显示样式color)

如果元素的位置属性发生改变,就要从渲染树布局阶段重新开始渲染(这就是页面重排);如果只是元素的显示样式改变,则只需从绘制阶段开始处理。我们应尽可能地避免页面重排,以达成更快的渲染速度。