前端面经 在地址栏输入URL，到页面呈现，中间会发生

前端面经 在地址栏输入URL，到页面呈现，中间会发生

1. 输入url后，首先需要找到这个url域名的服务器ip
   • 浏览器首先寻找缓存，查看缓存中是否有记录
     查找记录为：浏览器缓存->系统缓存->路由器缓存
   • 缓存没有则查找系统的host文件中是否有记录
   • 如果没有则查询DNS服务器
2. 得到服务器的ip后，浏览器根据这个ip以及相应的端口号，构造一个http请求，这个请求封装在一个tcp包中，这个tcp包会依次经过传输层、网络层，数据链路层，物理层到达服务器
3. 服务器解析这个请求并做出响应，返回相应的html给浏览器
4. 浏览器根据html来构建DOM树
   在DOM树的构建过程中如果遇到JS脚本和外部JS连接，则会停止构建DOM树来执行和下载相应的代码，这会造成阻塞
5. 根据内部样式、外部样式、内联样式构建一个CSS对象模型树CSSOM树；构建完成后和DOM树合并成渲染树
   这里主要做的是排除非视觉节点，比如script,meta标签和排除display为none的节点
6. 进行布局，布局主要是确定各个元素的位置和尺寸
7. 渲染页面
   因为html 文件中会含有图片，视频，音频等资源，在解析 DOM 的过程中，遇到这些都会进行并行下载，浏览器对每个域的并行下载数量有一定的限制，一般是 4-6 个

请求中需要关注缓存

当然在这些所有的请求中我们还需要关注的就是缓存，缓存一般通过Cache- Control、Last-Modify等首部字段控制。Cache-Control 使用相对时间，Cache-Control，在请求这些有设置了缓存的数据时，会先查看是否过期，如果没有过期则直接使用本地缓存，过期则请求并在服务器校验文件是否修改，
如果上一次 响应设置了ETag 值会在这次请求的时候作为 If-None-Match 的值交给服务
器校验，如果一致，继续校验 Last-Modified，没有设置ETag 则直接验证
Last-Modified，再决定是否返回 304。