从输⼊URL到⻚⾯展⽰完整流程⽰意图:
浏览器进程、渲染进程和⽹络进程的主要职责:
-
浏览器进程主要负责⽤⼾交互、⼦进程管理和⽂件储存等功能。
-
⽹络进程是⾯向渲染进程和浏览器进程等提供⽹络下载功能。
-
渲染进程的主要职责是把从⽹络下载的HTML、JavaScript、CSS、图⽚等资源解析为可以显⽰和交互的 ⻚⾯。
因为渲染进程所有的内容都是通过⽹络获取的,会存在⼀些恶意代码利⽤浏览器漏洞对系统进⾏攻 击,所以运⾏在渲染进程⾥⾯的代码是不被信任的。这也是为什么Chrome会让渲染进程运⾏在安全沙箱 ⾥,就是为了保证系统的安全。
这个过程可以⼤致描述为如下:
- ⾸先,⽤⼾从浏览器进程⾥输⼊请求信息;
- 然后,⽹络进程发起URL请求;
- 服务器响应URL请求之后,浏览器进程就⼜要开始准备渲染进程了;
- 渲染进程准备好之后,需要先向渲染进程提交⻚⾯数据,我们称之为提交⽂档阶段;
- 渲染进程接收完⽂档信息之后,便开始解析⻚⾯和加载⼦资源,完成⻚⾯的渲染
从输⼊URL到⻚⾯展⽰
⽤⼾输⼊
当⽤⼾在地址栏中输⼊⼀个查询关键字时,地址栏会判断输⼊的关键字是搜索内容,还是请求的URL。
- 如果是搜索内容,地址栏会使⽤浏览器默认的搜索引擎,来合成新的带搜索关键字的URL。
- 如果判断输⼊内容符合URL规则,那么地址栏会根据规则,把这段内容加上协议,合成为完整的URL。
例如输入画画

输入不带协议的网址 例如 fanfankill.github.io 会自动加上https:😕/
URL请求过程
浏览器进程会通过进程间通信(IPC)把URL请求发送⾄⽹络 进程,⽹络进程接收到URL请求后,会在这⾥发起真正的URL请求流程。
⾸先,⽹络进程会查找本地缓存是否缓存了该资源。如果有缓存资源,那么直接返回资源给浏览器进程;如 果在缓存中没有查找到资源,那么直接进⼊⽹络请求流程。
这请求前的第⼀步是要进⾏DNS解析,以获取请 求域名的服务器IP地址。如果请求协议是HTTPS,那么还需要建⽴TLS连接。
接下来就是利⽤IP地址和服务器建⽴TCP连接。连接建⽴之后,浏览器端会构建请求⾏、请求头等信息,并 把和该域名相关的Cookie等数据附加到请求头中,然后向服务器发送构建的请求信息。
服务器接收到请求信息后,会根据请求信息⽣成响应数据(包括响应⾏、响应头和响应体等信息),并发给 ⽹络进程。等⽹络进程接收了响应⾏和响应头之后,就开始解析响应头的内容了。
-
重定向
在接收到服务器返回的响应头后,⽹络进程开始解析响应头,如果发现返回的状态码是301或者302,那么 说明服务器需要浏览器重定向到其他URL。这时⽹络进程会从响应头的Location字段⾥⾯读取重定向的地 址,然后再发起新的HTTP或者HTTPS请求,⼀切⼜重头开始了。
-
响应数据类型处理
Content-Type是HTTP头中⼀个⾮常重要的字段, 它告诉浏览器服务器返回的响应 体数据是什么类型,然后浏览器会根据Content-Type的值来决定如何显⽰响应体的内容。例如 text/html 是HTML格式, application/octet-stream 是字节流类型,通常情况下,浏览器会按照下载类型处理
如果Content-Type字段的值被浏览器判断为下载类型,那么该请求会被提交给浏览器的下载管理器,同时该URL请求的导航流程就此结束。但如果是HTML, 那么浏览器则会继续进⾏导航流程。
-
准备渲染进程
默认情况下,Chrome会为每个⻚⾯分配⼀个渲染进程,每打开⼀个新⻚⾯就会配套创建⼀个新的渲染进程。在某些情况下,浏览器会让多个⻚⾯直接运⾏在同⼀个渲染进程中。
那什么情况下多个⻚⾯会同时运⾏在⼀个渲染进程中呢?
我们将“同⼀站点”定 义为根域名(例如 fanfankill.github.io)加上协议(例如,https:// 或者http://),还包含了该根域名下的所有 ⼦域名和不同的端⼝
它们都是属于同⼀站点,因为它们的协议都是HTTPS,⽽且根域名也都是fanfankill.github.io。
但如果从⼀个⻚⾯打开了另⼀个新⻚⾯,⽽新⻚⾯和 当前⻚⾯属于同⼀站点的话,那么新⻚⾯会复⽤⽗⻚⾯的渲染进程。
总结来说,打开⼀个新⻚⾯采⽤的渲染进程策略就是:
- 通常情况下,打开新的⻚⾯都会使⽤单独的渲染进程;
- 如果从A⻚⾯打开B⻚⾯,且A和B都属于同⼀站点的话,那么B⻚⾯复⽤A⻚⾯的渲染进程;如果是其他情 况,浏览器进程则会为B创建⼀个新的渲染进程。
-
提交文档
这⾥的“⽂档”是指URL请求的响应体数据
- “提交⽂档”的消息是由浏览器进程发出的,渲染进程接收到“提交⽂档”的消息后,会和⽹络进程建⽴ 传输数据的“管道”。
- 等⽂档数据传输完成之后,渲染进程会返回“确认提交”的消息给浏览器进程。
- 浏览器进程在收到“确认提交”的消息后,会更新浏览器界⾯状态,包括了安全状态、地址栏的URL、前 进后退的历史状态,并更新Web⻚⾯。
这也就解释了为什么在浏览器的地址栏⾥⾯输⼊了⼀个地址后,之前的⻚⾯没有⽴⻢消失,⽽是要加载⼀会 ⼉才会更新⻚⾯。
-
渲染阶段
⼀旦⽂档被提交,渲染进程便开始⻚⾯解析和⼦资源加载了
⼀旦⻚⾯⽣成完成,渲染进程会发送⼀个消息给浏览器进程,浏览器接 收到消息后,会停⽌标签图标上的加载动画。
