浏览器输入URL按回车后，会发生什么?

界面渲染过程

步骤

1、用户输入想要访问的url地址

2、DNS会完成域名解析，帮我们找到相应的IP服务器主机

Chrome浏览器会首先搜索浏览器的DNS缓存，看自身的缓存中是否有 www.lagou.com对应的条目，而且没有过期，如果有且没有过期则解析到此结束。 如果浏览器自身的缓存里面没有找到对应的条目，那么Chrome会搜索操作系统的DNS缓存，如果找到且没有过期则停止搜索解析到此结束。 如果在Windows系统的DNS缓存也没有找到，那么尝试读取hosts文件，看看这里面有没有该域名对应的IP地址，如果有则解析成功。

3、建立TCP的端到端的连接（将用户电脑和服务器主机建立一条传输数据的通道,执行三次握手请求）

4、TCP处于网络模型中的传输层，具体的BS架构数据传输是在应用层进行的，所以我们需要通过应用层的HTTP协议来和服务器主机进行数据的交换

HTTP请求报文的方法是 get ，如果浏览器存储了该域名下的 Cookies，那么会把 Cookies放入 HTTP请求头里发给服务器，用于识别用户信息。

5、服务端会依据客户端提交的数据进行计算，从而返回具体的内容到客户端

服务器端WEB程序接收到http请求以后，就开始处理该请求，处理之后就返回给浏览器html文件。

6、第五步完成之后就相当于浏览器此时拿到了网页资源数据（字符串）【字节：网络IO磁盘操作的是二进制数据】

7、浏览器拿到字节数据之后就想要对它进行渲染，然后展示在页面上

当下的浏览器都是多进程 多个渲染进程—Html、css、js相关的操作 插件进程—针对于浏览器插件的处理 浏览器主进程—管理浏览器本身的一些操作 GPU进程—最初就是用来实现3D动画的 网络进程—下载网络资源

浏览器如何渲染界面

a、渲染进程就会开启一个进程调用Html解析器来执行渲染

b、首先会将字节数据处理成字符串，然后再从字符串中挑出来对应的Token（标签），最后将这些标签放入到一个DOM树中

c、与DOM构建同时还有一个CSSOM树的构建过程（是用来加载CSS样式的，从根节点开始查找，存在样式继承）

d、将DOM树和CSSOM树进行合并生成渲染树（也是一个存在于内存里的东西，浏览器页面看不到）

e、依据渲染树进行回流（重排）可以依据之前的树来确定界面上的元素的几何信息（大小、位置）

f、 回流之后的操作就是重绘，将上面计算出来的所有信息都通过GPU调用相应的GUI API后绘制屏幕上

g、之后就可以看到界面了

最后编写前端代码的时候可以进行优化，针对于每一步可以提升性能