首先浏览器会判断状态码是什么，如果是 200 那就继续解析，如果 400 或 500 的话就会报错，如果 300 的话会进行重定向，这里会有个重定向计数器，避免过多次的重定向，超过次数也会报错 。
浏览器解析
浏览器开始解析文件，如果是 gzip 格式的话会先解压一下，然后通过文件的编码格式去解码文件 。
文件解码成功后会正式开始渲染流程，先会根据 HTML 构建 DOM 树，有 css 的话会去构建 CSSOM 树 。如果遇到 script 标签的话，会判断是否存在 async 或者 defer ，前者会并行进行下载并执行 JS，后者会先下载文件，然后等待 HTML 解析完成后顺序执行 。
文章插图
如果以上都没有，就会阻塞住渲染流程直到 JS 执行完毕 。遇到文件下载的会去下载文件，这里如果使用 HTTP/2 协议的话会极大的提高多图的下载效率 。
CSSOM 树和 DOM 树构建完成后会开始生成 Render 树，这一步就是确定页面元素的布局、样式等等诸多方面的东西
在生成 Render 树的过程中，浏览器就开始调用 GPU 绘制，合成图层，将内容显示在屏幕上了 。
总结总的来说，今天这篇文章主要是带着大家从 DNS 查询开始到渲染出画面完整的了解一遍过程，里面涉及到DNS、HTTP、TLS、负载均衡和浏览器渲染等等内容，算不上非常详细，但如果面试的时候能说出来这些，相信面试官也会对你刮目相看的 。
推荐阅读
- Edge浏览器垂直标签页PWA用户界面一览
- 微软|Win11新版终于改回来了：强迫Edge默认浏览器这一大槽点没了
- Render Studio Creo渲染入门，实用提升
- WebAssembly 如何演进成为“浏览器第二编程语言”？
- 浏览器爆出严重漏洞，谷歌、微软、Opera电脑版和安卓版都受影响
- 分享一个免费申请https证书的方法。可以被各大主流浏览器信任
- Tomcat 系统架构与原理剖析
- 手把手教你直接从应用店为Chrome浏览器安装超好用插件
- 永劫无间手机能玩吗？
- js浏览器打印指定div