从URL在浏览器被输入到页面展现的过程中发生了什么？

浏览器输入一个地址。到页面展示中间经历了哪些东西？

1、浏览器输入url。先解析url地址是否合法

2、浏览器检查是否有缓存（浏览器缓存-系统缓存-路由器缓存）。如果有，直接显示。如果没有，跳到第三步。

3、在发送http请求前，需要域名解析（DNS解析），解析获取对应过的ip地址。

4、浏览器向服务器发起tcp链接，与浏览器建立tcp三次握手

5、握手成功后，游览器向服务器发送http请求，请求数据包

6、服务器收到处理的请求，将数据返回至浏览器

7、浏览器收到http响应。

8、浏览器解析响应。如果响应可以缓存，则存入缓存

9、浏览器发送请求获取嵌入在HTML中的资源（html，css，JavaScript，图片，音乐等），对于未知类型，会弹出对话框

10、浏览器发送异步请求

11、页面全部渲染结束。（前端的话，还要细谈渲染过程）

页面渲染过程：

1、从HTML中解析出DOM Tree；
2、从CSS中解析出CSSOM Tree；
（第1步和第2步并行操作，不分先后）
3、DOM Tree和CSSOM Tree组合起来形成渲染树（Render Tree）
4、Reflow：计算出Render Tree上各个元素的物理属性，如位置、大小、是否看得见（visible）
5、Repaint：将计算结果转为实际的像素，画到页面上

---

重排（reflow）和重绘（repaint）是指浏览器渲染页面时的两个关键步骤。

重排指的是浏览器根据DOM树和CSS样式计算出每个元素在页面中的几何位置和大小的过程。当页面的布局发生变化，比如元素的位置、大小、内容或样式发生改变时，浏览器需要重新计算并确定元素的最终位置。这个过程是相对耗费性能的，因为它会涉及到多个元素的重新计算和布局。

重绘指的是根据计算好的布局信息，将元素的内容绘制到屏幕上的过程。当元素的样式发生变化，比如颜色、背景、边框等属性改变时，浏览器需要重新绘制这些元素。相比于重排，重绘的性能开销较小。