1、URL地址检测、缓存检查
- 输入地址后会进行URL地址的纠错和补全，如果地址中有中文还会进行中文转码（提取协议、域名、端口、路径等）。
- 缓存检查，在确认输入的是有效URL后，浏览器才会开始检查本地缓存（包括浏览器缓存、系统Hosts文件、本地DNS缓存等）是否已有该资源的缓存副本。
2、DNS解析
- 首先会查看DNS缓存中是否有缓存该域名对应的 IP 地址，有则用无则继续解析。
- DNS域名解析 解析出对应IP地址。
3、建立TCP连接
-
进行TCP三次握手，这一过程确保了双方都具备发送和接收数据的能力，为后续的HTTP请求打下可靠基础。
-
端口选择：TCP连接的目标端口通常由URL协议决定：
- HTTP 默认使用 80 端口；
- HTTPS 默认使用 443 端口 。
-
HTTPS额外步骤：若URL以
https://开头，在TCP连接建立后，还需进行 TLS/SSL握手，用于协商加密算法、交换密钥并验证服务器身份 。 -
连接复用优化：现代浏览器可能复用已有的TCP连接（通过
Connection: keep-alive头），避免重复三次握手，提升性能。 -
流程说明：
- 1、 如果只是HTTP请求则只有TCP三次握手建立连接（好比：修好一条安全的马路）
- 2、 如果是https请求，则在TCP连接建立后，还要进行TLS/SSL握手（好比：在连接上叠加安全，在这条马路上搭建一个加密的安全隧道）
- 3、 HTTPS通信是在安全通道中进行加密的HTTP数据传输（好比：最后让你的数据车辆在隧道里安全行驶）
4、准备请求头
- 请求头中的这些参数用于向服务器传递客户端信息、协商响应内容格式、管理连接与缓存等。
- Host：指定目标服务器的域名和端口号，是 HTTP/1.1 协议中必需的字段，用于虚拟主机区分。
- User-Agent：标识客户端类型（如浏览器名称、版本、操作系统），帮助服务器返回适配的内容（如移动端或 PC 端页面。
- Accept：声明客户端可接收的内容类型（MIME 类型），如
text/html,application/json，用于内容协商。 - Cookie：携带之前由服务器通过
Set-Cookie设置的会话信息，用于维持登录状态等。 - Cache-Control：指令缓存行为，如
no-cache（不使用缓存）、max-age=3600（缓存 1 小时）等，影响性能与一致性。 - 等等不再一一列举。
5、发送请求头
6、服务器响应
在这一过程中服务器可能会涉及：数据库查询、调用第三方 API、用户认证与权限校验、会话管理等生成响应内容。
7、处理响应头
处理响应头是服务器返回 HTTP 响应的关键环节。当浏览器接收到服务器发回的 HTTP 响应后，会首先解析响应头
- 解析状态行：响应头的第一行是状态行，包含 HTTP 版本、状态码（如 200、301、404）和状态描述（如 OK、Not Found）。浏览器根据状态码决定后续行为（例如重定向、错误提示等）。
HTTP1.1 连接复用策略 多个请求按照顺序使用同一个连接，减少挥手开销；
HTTP2.0 多路复用策略 多个请求并行使用一个连接； - 读取关键响应头字段：
Content-Type：告知浏览器响应体的数据类型（如text/html、application/json），用于决定如何解析和渲染内容29。Set-Cookie：若存在，浏览器会将 Cookie 存储到本地，后续请求会自动携带。Location：用于重定向（如 301、302），浏览器会自动发起新请求。
301和302 都表示重定向，需要进一步操作完成请求；
301 永久性转移
场景：
（1）网站迁移或重定向到新的域名。
（2）永久性地将某个页面或资源移动到新的路径。
302 临时性转移，最终还会回归原先地址。
场景：
系统临时维护、调整等
304 请求的资源未被修改，客户端可以使用本地缓存的版本。 常见场景：
（1）客户端请求了一个资源，但该资源自上次请求以来未被修改。
（2）用于优化性能，减少不必要的数据传输。Cache-Control/Expires：指示资源是否可缓存及缓存时间，影响浏览器缓存策略。
浏览器缓存：强缓存Cache-Control/Expires
协商缓存：ETag/if-none-match 是HTTP1.1产物， last-modified/if-modified-since是HTTP1.0产物Connection：决定是否保持 TCP 连接（如keep-alive或close）是否保持长连接。- 等
8、收响应体及渲染
资源加载解析HTML，这一部分完成后会得到DOM树 和CSSOM树
- 遇到link href css样式下载和解析不会影响主线程渲染，会继续解析后续HTML，因为下载和接续css的工作在预解析线程中进行，所以css不会阻塞HTML解析。
- js 若主线程遇到script，会停止解析HTML等待JS文件下载好并将全局代码执行完成，才能继续HTML解析，因为JS代码执行可能会修改dom树，所以dom树生成必须暂停，顾JS会阻塞HTML解析。
- 若为图片、字体等资源，则发起额外请求加载，一般不会影响HTML解析；
- 补充： 解析过程中可能会涉及：资源描述符
- script：资源描述符
<script 此efer/ansyn ></script>
async 异步下载文件，下载过程不阻塞解析，但是下载完成后会暂停HTML解析，优先执行脚本，执行完成后才会再继续HTML解析。不保证顺序，谁先下载完谁先执行。特点：下载不阻塞解析，执行阻塞解析，且不保证循序。
defer 异步下载脚本，下载过程不阻塞解析，下载后不会立即执行，会放到延迟执行队列中，会等待HTML解析完成才执行脚本。特点：下载不阻塞解析，执行阻塞解析，html解析完成后才执行，且按照脚本顺序执行。 - css：资源描述符
<link rel="repload/prefetch" ></link>repload： 预加载，必须指定as属性（告诉浏览器资源类型以便设置正确的优先级和缓存策略），当前页面肯定要用的资源，高优先级，时机：提前加载与当前页面资源同等优先级。场景：当前页面需要的字体，关键css、首屏图片；
prefetch：预获取 下一个页面可能需要的资源，低优先级加载，时机：浏览器空闲时加载，场景：下一个页面需要的资源用户可能访问的页面资源。
style样式计算 (computed style)
主线程遍历DOM树后，依次为树中节点计算出最终样式，会得到一棵带有样式的DOM树。（这一过程预设值会变成绝对值，如：rem 变成px）;
layout 布局，完成后得到布局树
遍历DOM树，计算每个节点的几何信息，如宽高，相对包含块的位置，大部分时候DOM树和布局树并非一一对应。
如：
1、display：none； 没有集合信息，生成DOM树，但是没有布局树。
2、伪元素，在DOM树中不存在，但它们有几何信息，所以会在布局树中。
3、匿名行盒、匿名块盒等等会导致DOM树和布局树无法一一对应，因为它的布局规则：css中有行盒块盒：1）内容只能放到行盒中 2）、行盒块盒不能相邻。
layer 分层
主线程会使用一套特殊的策略对整个布局树进行分层。
好处：若某一次修改仅对该层进行处理，从而提升效率。
补充：滚动条、堆叠上下文、transform、opacity等样式都会多少影响分层结果，也可用will-change："transform"改变 .
优化：若发现某块渲染效率低，或总是改变则可以考虑使用分层will-change。will-change可做性能优化，提前告知浏览器元素未来的变化。通过创建独立的合成层，让GPU加速渲染。
paint 绘制
根据分层绘制渲染指令paint，主线程会为每个层单独产生指令，用于描述这一层的内容该如何画出来。
————这步之后会交给合成线程。
完成绘制后，主线程会将每个图层的绘制信息提交给合革线程，剩余工作由合成线程完成。
tiling 分块
将每一层分为多个小的区域，会优先分并画靠近视口区域的块。合成线程会对每个图层进行分块，划分为更多小区域。
raster 光栅化
光栅化是将每个块变成位图，也就是变成像素点，优先处理靠近视口的块。光栅化在GPU中进行，会开启多个线程来完成光栅化。
draw 画
合成线程计算出每个位图在屏幕上的位置，交给GPU进行最终呈现，这时会考虑旋转、缩放、变形等；
优化 ：
变形等发生在合成线程，与渲染主线程无关，这就是transform效率高的原因。
最后经过沙河等一列操作，在电脑屏幕上显示
9、四次挥手
会根据情况决定是否要断开连接。 如果设置了Connection: keep-alive则需要保持长连接。
以上就是学习整理的输入URL之地后按下回车发生了什么的问题，若有错误，欢迎指正，互相学习
