浏览器输入网络地址发生了什么
此问题是面试的“长驻”问题，考察的知识面也比较广。
如：浏览器进程线程 网络通信 渲染引擎工作原理等
经过这些问题可以拓展更深度的问题。
如：网络安全 同源策略 HTTP缓存 SSL/TLS HTTP不同版本的差异 Event Loop 预加载、懒加载 Cookie 等
可拓展的比较多，之后会陆续总结相关知识。希望多多支持~~~谢谢大家🤡🤡🤡
1. 输入URL
用户在浏览器地址栏中输入URL，如https://www.example.com/index.html。
2. 解析URL
浏览器进程首先解析URL，识别出协议（HTTPS）、域名（www.example.com）、路径（/index.html）和查询字符串 和 查询字符串（如果有）。
3. DNS 查询 IP 地址
因为网络通信时，一般会是由TCP/IP协议，所以需要吧域名转换成IP进行网络通信。
浏览器通过DNS（域名系统）将域名转换为IP地址。这一过程通常包括：
- 检查本地缓存：浏览器首先检查本地DNS缓存。
- 查询操作系统缓存：如果不在本地缓存，浏览器请求操作系统缓存中的记录。
- host文件：如果操作系统缓存也没有，就查询host配置文件。
- 网络查询：如果一首都没有，请求会被发送到本地DNS服务器，后者可能递归查询根域名服务器、顶级域名服务器、权威域名服务器，直到获得IP地址。
4. 建立TCP连接
使用获取到的IP地址，浏览器通过TCP三次握手与服务器建立连接。如果是HTTPS，还需进行TLS/SSL握手，以确保数据传输的安全性。
5. 发送HTTP/HTTPS请求
建立连接后，浏览器构造HTTP或HTTPS请求头，包含请求行（如GET /index.html HTTP/1.1）、请求头部（如User-Agent、Accept-Language等）和可能的请求体（POST请求时）。
6. 服务器处理请求
服务器收到请求后，根据请求的资源类型（HTML、CSS、JavaScript等）和路由（如/index.html），进行处理。这可能涉及数据库查询、服务器端脚本执行（如PHP、Node.js）等。
7. 服务器响应
服务器准备响应内容，包括状态码（如200 OK）、响应头部（如Content-Type、Content-Length）和响应体（网页内容）。如果是动态生成的内容，这一步可能涉及模板渲染等。
8. 数据传输
响应数据通过之前建立的TCP连接传输给浏览器。如果是分块传输或使用了HTTP/2的多路复用，数据可以更高效地传输。
9. 渲染页面
浏览器接收到来自服务器的响应数据后：
- 解析HTML：构建DOM（文档对象模型）树。
- 加载CSS：根据CSS规则计算样式，形成CSSOM（CSS对象模型）。
- 合并DOM与CSSOM：生成渲染树（Render Tree），决定页面布局。
- 布局与绘制：计算元素几何位置，进行像素绘制，最终在屏幕上呈现页面。此时可能会产生
重绘、回流
10. 加载其他资源
页面中的图片、脚本、样式等外部资源会根据HTML中的引用顺序加载。JavaScript可能阻塞渲染或修改DOM，影响后续资源的加载和执行。
11. 交互与后续请求
页面加载完成后，用户可以与页面交互。交互过程中可能触发AJAX请求、Websocket通信等，实现动态内容更新或实时通讯。
关于 Vue 相关的问题可以阅读一下文章！
