输入url后页面渲染流程
详细版本
当在浏览器中输入URL并按下回车时，常见的页面渲染流程。
- DNS解析：浏览器首先会搜索浏览器自身的DNS缓存，如果有未过期的数据则解析结束。反之没有，浏览器会解析输入的URL，获取对应的域名，然后通过DNS解析将域名转换为服务器的IP地址。（搜索流程：浏览器-> 系统host文件->路由器的DNS缓存）
- 建立TCP连接：浏览器通过使用HTTP协议的默认端口（通常是80）与服务器建立TCP连接。如果是HTTPS，则使用安全的SSL/TLS协议建立加密连接（默认端口是443）
- 发送HTTP/HTTPS请求：浏览器向服务器发送HTTP/HTTPS请求，其中包含请求的方法（GET、POST等）、请求头部、请求体等信息。请求头部包含了一些元数据，例如用户代理、Cookie、缓存策略等。
- 服务器处理请求：服务器接收到浏览器发送的HTTP/HTTPS请求后，会根据请求的路径、方法和其他参数来处理请求。服务器可能会查询数据库、处理业务逻辑、生成动态内容等。
- 返回HTTP/HTTPS响应：服务器生成一个HTTP/HTTPS响应，其中包含了响应状态码、响应头部、响应体等信息。响应头部包含了一些元数据，例如内容类型、缓存策略等。
- 浏览器接收响应内容：浏览器接收到服务器发送的HTTP/HTTPS响应后，会解析响应头部和响应体。响应头部中的内容类型（Content-Type）告诉浏览器如何解析响应体的内容。
- 渲染页面：如果响应的内容是HTML页面，浏览器会根据HTML标记语言解析响应体的内容，并构建DOM树。然后浏览器会根据CSS样式表对DOM树进行样式计算，生成渲染树。
- 布局和绘制：浏览器根据渲染树对元素进行布局，计算元素的位置和大小。最后，浏览器根据布局结果将渲染树的元素绘制到屏幕上。
- 执行JavaScript：如果页面中包含JavaScript代码，浏览器会执行这些代码。JavaScript可以修改页面的结构、样式和行为。
- 断开TCP连接：数据交互完成以后，需要关闭连接，回收资源
简介版
- 浏览器查看是否有DNS缓存，有则直接返回IP，若无，则将URL交给DNS域名解析，找到服务器IP
- 建立TCP连接
- 向服务器发起请求
- 服务器交给后台处理完成后返回数据
- 浏览器接收并解析响应内容
- 浏览器渲染页面、进行布局和绘制
- 执行JS交互
- 断开链接