从输入URL到最终页面呈现，具体发生了什么，这个过程很复杂。

这个问题可以非常细致，实际到计算机方方面面，总的来说可以分为以下几个阶段。

浏览器请求流程

1. 浏览器接收到 URL，到网络请求线程的开启。
2. 一个完整的 HTTP 请求并的发出。
3. 服务器接收到请求并转到具体的处理后台。
4. 前后台之间的 HTTP 交互和涉及的缓存机制。

建立网络请求

首先，用户输入url，浏览器通过解析url获得url中的信息。 主要包括协议，域名，端口，路径，参数，路由或者锚点。

Protocol://Host:Port/Path?Query#Fragment

这部分会分为两部分，DNS解析和建立与服务端的通信。 首先浏览器需要明确要访问的服务器地址，然后建立通往该地址的路径。

DNS解析

即根据URL域名转化为具体的IP地址，域名只是帮助人记忆的，IP地址才是网络中服务器的标识。

具体的，DNS解析同样是个环节复杂的过程，首先会经历本地主机查找缓存

1. 查找浏览器缓存
2. 系统自身DNS缓存
3. hosts文件

未找到则继续查找域名服务器，依次通过根域名服务器，顶级域名服务器，权限域名服务器；每一步找到ip则返回，未找到则继续向上级查找，最终未找到则报错返回。

TCP连接

三次握手， 简单理解即为，

1. 客户端请求'建立连接'
2. 服务端响应'请求'
3. 客户端发送'确认收到'

四次挥手断开连接

1. 客户端请求 '断开连接'
2. 服务端发送 '收到断开请求'，但还没准备好断开
3. 服务端准备好了，发送'可以断开请求'
4. 客户端发送'关闭连接'

反向代理服务器

越来越复杂的场景中，我们访问到后端的可能是反向代理服务器。他的作用是根据客户需求从后端服务器获取资源后提供给客户端；通常有以下功能

1. 负载均衡
2. 安全防火墙
3. 加密及SSl加速
4. 数据压缩
5. 解决跨域
6. 对静态资源进行缓存

后端处理

经过反向代理服务器之后，具体到服务器处理通常会有以下流程。

1. 首先会有一层一层到验证环节，比如跨域验证，安全校验，权限校验等。不符合直接返回拒绝等报文。
2. 通过验证后会进入具体的后端程序，通过计算数据库查询等等。
3. 完成计算，后台再响应http数据包返回给客户端

关键渲染路径

浏览器通过解析HTML和CSS文件来构建页面，具体步骤如下

1. 解析构建dom树 ，解析单进程顺序执行，遇到css js则执行；对于defer async 或者图片，则不影响解析
2. 解析构建Cssom树
3. 合并dom与 cssom为渲染树（布局树，不包含不可见节点）
4. 布局可见节点， 根据渲染树布局节点宽高和位置，对于图片未指定宽高，则先忽略等待加载完成再重新计算受影响的大小位置即 回流，
5. 布局树生成图层树 - 生成图层的标签或属性主要包含：3d转化，fixed定位 video标签，canvas ，css动画
6. 绘制-组合图层，将每个节点具体绘制转化为屏幕上像素点
7. defer async的js脚本开始执行；如果有更改dom或者css，则视情况重排或者重绘。