大概流程
人问你，你这么答，流程是这么个流程：：
url验证、dns解析、
↓
tcp连接、http请求、响应（tls握手）、
↓
浏览器渲染、
↓
资源加载、js执行、
↓
连接关闭
每个点
1. URL 解析与 DNS 查询
- URL 有效性检测：浏览器首先检查输入的 URL 格式是否正确
- DNS 解析过程：
- 查找浏览器缓存 → 查找本地 host 文件 → 查询本地 DNS 服务器
- 若未找到则继续向远程 DNS 服务器查询，直到获取 IP 地址
- 将解析结果缓存到本地
用话语表述出来就是这样（念一念或者背出来，前提是得理解）：
首先是
URL有效性检测，接下来会进行DNS解析。
DNS解析的过程是通过查找浏览器缓存、查找本地host文件。
再通过本地DNS服务器，到远程DNS服务器，直到找到IP地址。
然后缓存到本地。
口诀：有效url，解析dns（找host文件，从本地到远程，直到找到ip，存本地）。
2. 建立网络连接
- TCP 三次握手：建立可靠的 TCP 连接
- 浏览器发送 HTTP 请求（包含请求头和请求体）
- 服务器处理请求并返回响应：
- 响应头（包含状态码、缓存策略、Cookie 等）
- 响应体（HTML 等内容）
- TLS 握手（HTTPS 情况）：
- 非对称加密交换密钥
- 证书验证（涉及 CA 认证机构）
- 建立对称加密通道
用话语表述出来就是这样（念一念或者背出来，前提是得理解）：
『 接着是tcp三次握手。
tcp连接后，http请求，传输数据，然后响应回来。
如果有tls加密过程，涉及到对称和非对称加密、传输加密密钥等认证机构的参与。』
口诀：tcp握手，http请求（https的话tls握手）。
3. 浏览器渲染流程
HTML 解析与 DOM 构建
- 词法分析：将 HTML 转换为 Tokens
- DOM 树构建：通过 DOM 构建器生成 DOM 树
CSS 解析与样式计算
- CSSOM 构建：解析 CSS 生成 CSSOM 树
- 渲染树构建：结合 DOM 和 CSSOM 生成渲染树
布局与绘制
- 布局（Layout）：计算元素的位置和大小
- 分层（Layering）：将页面分成不同图层
- 绘制（Painting）：生成绘制指令
- 栅格化（Rasterization）：将图层切分为图块并生成位图
- 合成（Compositing）：通过合成线程处理，GPU 最终渲染
用话语表述出来就是这样（念一念或者背出来，前提是得理解）：
『 之后是获取资源的过程，浏览器内核通过Webkit来解释HTML，
HTML解析过程中，首先是词法分析，Token化，之后由DOM构建器构建DOM树。
接着CSS解析生成CSSOM，再将它们结合起来，形成渲染树。
渲染树会被分成不同的层次，然后通过合成线程进行处理。
每一层通过栅格化（tile）进行切分，生成位图并交给GPU进行渲染。』
口诀：浏览器解析html（过程：词法分析、token化、dom构建器做dom、css解析器做cssom，最后成树🌲。接着线程处理：每一层栅格化，GPU处理位图。）
4. 资源加载与执行
- JavaScript 处理：
- 同步脚本会阻塞 DOM 解析和渲染
async：异步加载，加载完成后立即执行defer：异步加载，等 DOM 解析完成后执行
- CSS 影响：
- CSS 加载会阻塞渲染（避免 FOUC）
- CSSOM 构建会阻塞 JavaScript 执行
用话语表述出来就是这样（念一念或者背出来，前提是得理解）：
『 有时浏览器会异步加载资源，特别是JavaScript（JS）的加载方式，通过
async和defer来优化，避免阻塞DOM的渲染。
同步脚本（sync）会影响DOM渲染，因为JS执行是单线程的。
CSS加载和执行也会影响DOM渲染。』
口诀：单线程加载不阻塞，js优化async、defer。
5. 连接关闭
- TCP 四次挥手：完成数据交换后关闭连接
口诀：做完事，tcp连接关闭。
