请求网址URL到页面渲染，中间发生了几步？ | 前端面试基础

在搜索 EventLoop 时无意看到了 这篇文章：inside-browser（chrome），中间过程描述地很清晰细腻。详细看完本篇后，希望能轻松应对这类“在浏览器输入 URL 后发生了什么？”面试题。

浏览器中进程和线程的构成

Browser 进程：UI 线程，Network 线程，GPU 线程

以 Chrome 举例，当我们打开浏览器时，便创建了 Browser 浏览器进程 ，内部会启动 UI 线程 ， Network 线程 对用户输入的 URL 地址做页面跳转，以及负责后续的资源加载。

Renderer 进程：Main 线程，Compositor 线程，Raster 线程

页面的渲染会通过 Renderer 渲染进程 进行，整个过程通过 Main主线程 来串连。渲染的内容会涉及 Compositor 线程 和 Raster 线程 。 下面针对 在浏览器输入 URL 后发生了什么？ 这一问题，列举几个重要的步骤进行说明：

第1步：地址栏输入地址

当打开浏览器后会创建一个 Browser 进程 ，用户在地址栏中输入文字后，浏览器的 UI 线程（UI thread） 将解析输入的内容，并判断到底是一个 URL 还是普通词语，已决定后续的调用方式。

第2步：开始导航跳转

当回车确认的内容为 URL 后，将开启一个 tab 标签页。同时 网络线程（network thread） 将开始工作：开始 DNS 寻址以及建立 TLS 传输通道。

第3步：解析 Response 信息，进行安全检测

根据 Response 信息中的 Content-Type 响应头来判断该数据资源属于哪种 媒体类型，比如：text/html、image/png... 同步，浏览器还会开启安全监测，用来告知用户哪些链接是危险链接，给与警告提示：