面试：浏览器从输入url到渲染页面，发生了什么-Toy模板网

这篇具有很好参考价值的文章主要介绍了面试：浏览器从输入url到渲染页面，发生了什么。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

用户输入阶段
合成 URL：浏览区会判断用户输入是合法 URL，比如用户输入的是搜索的关键词，默认的搜索引擎会合成新的，如果符合url规则会根据url协议，在这段内容加上协议合成合法的url

查找缓存
网络进程获取到 URL，先去本地缓存中查找是否有缓存资源，如果有则拦截请求，直接将缓存资源返回给浏览器进程；否则，进入网络请请求阶段；

DNS 解析：
DNS 查找数据缓存服务中是否缓存过当前域名信息，有则直接返回；否则，会进行 DNS 解析返回域名对应的 IP 和端口号，如果没有指定端口号，http 默认 80 端口，https 默认 443。如果是 https 请求，还需要建立 TLS 连接；

建立 TCP 连接：
TCP 三次握手与服务器建立连接，然后进行数据的传输；（三次握手开喷）

发送 HTTP 请求：
浏览器首先会向服务器发送请求行，它包含了请求方法、请求 URI 和 HTTP 协议的版本；另外还会发送请求头，告诉服务器一些浏览器的相关信息，比如浏览器内核，请求域名；

服务器处理请求：
服务器首先返回响应行，包括协议版本和状态码，比如状态码 200 表示继续处理该请求；如果是 301，则表示重定向，服务器也会向浏览器发送响应头，包含了一些信息；

页面渲染:

查看响应头的信息，做不同的处理，比如重定向，存储cookie 看看content-type的值，根据不同的资源类型来用不同的解析方式

浏览器将获取的HTML文档解析成DOM树。
处理CSS标记，构成层叠样式表模型CSSOM(CSS Object Model)。
将DOM和CSSOM合并为渲染树(rendering tree)，代表一系列将被渲染的对象。
渲染树的每个元素包含的内容都是计算过的，它被称之为布局layout。浏览器使用一种流式处理的方法，只需要一次绘制操作就可以布局所有的元素。
将渲染树的各个节点绘制到屏幕上，这一步被称为绘制painting。

断开 TCP 连接：

数据传输完成，正常情况下 TCP 将四次挥手断开连接。但是如果浏览器或者服务器在HTTP头部加上 Connection: keep-alive，TCP 就会一直保持连接。文章来源地址https://www.toymoban.com/news/detail-457197.html