地址栏输入URL敲下回车后发生什么

答:

6. 页面渲染

1. 总体过程

2. URL解析

3. DNS查询

之前讲过(迭代查询), 获取目标服务器IP

4. TCP 连接

确定目标服务器IP地址后, 经历三次握手建立TCP连接

5. 发送HTTP请求

请求的内容包括：

6. 响应请求

行头空行体

7. 页面渲染

补充

补充：地址栏输入 URL 并回车后，浏览器依次经历「URL 解析 → DNS 解析 → TCP 连接 → 发送 HTTP 请求 → 服务器响应 → 浏览器解析渲染」六个阶段，下面按时间顺序串讲。

总体过程

  1. URL 解析：浏览器解析 URL 拿到协议、域名、端口、路径、查询字符串、hash，并对地址做编码/合法性检查。
  2. DNS 解析：浏览器 → 系统缓存 → 路由器 → ISP DNS → 根域 → 顶级域 → 权威域名服务器，迭代查到域名对应的 IP（可走 DoH/DoT 加密）。
  3. TCP 连接：与目标 IP 建立 TCP 连接，三次握手；若为 HTTPS 还要多一次 TLS 握手。
  4. 发送 HTTP 请求：构造请求行、请求头、请求体，HTTPS 下还会做加密。
  5. 服务器响应：服务器返回状态行、响应头、响应体；可能 301/302 触发重定向。
  6. 浏览器渲染：解析 HTML → 构建 DOM 树 → 解析 CSS 构建 CSSOM → 合并生成 Render 树 → 布局（Layout）→ 分层绘制（Paint）→ 合成（Composite）显示在屏幕上。
  7. 页面渲染优化：JS 执行可能在解析过程中触发 DOMContentLoaded / load 事件；CSS 阻塞渲染，JS 阻塞 DOM 构建；浏览器通过预解析、懒加载等手段提速。
URL 解析
  ↓
DNS 解析 → 拿到 IP
  ↓
TCP 三次握手 → （HTTPS 多一次 TLS 握手）
  ↓
发送 HTTP/HTTPS 请求
  ↓
服务器响应（可能重定向）
  ↓
浏览器解析 HTML / CSS / JS，渲染页面

补充：常见优化点包括 DNS 预解析（<link rel="dns-prefetch">）、HTTP/2 多路复用、浏览器缓存（强缓存 / 协商缓存）、CDN 就近回源、关键 CSS 内联等。