前端性能优化分析总结

涉及原理

HTTP协议

三次握手

• 客户端发出请求报文;
• 服务端收到后进行应答，对客户端的连接请求进行确认;
• 客户端收到服务器收到的连接确认请求后再向服务器发送确认信号。

问题一：为什么客户端需要再对服务器的报文进行确认呢？
这里是为了已经失效的报文突然又重传到B，因而产生错误。
采用三次握手可以防止这种现象的发生，客户端不对服务端的确认报文进行确认，服务器端由于收不到确认，就知道客户端没有要求建立连接。

四次挥手

• 数据传输结束后，客户端向服务器发送断开连接的请求；
• 服务器端收到确认报文后进行确认，释放从客户端到服务器端这个方向的连接,TCP连接处于半关闭状态；
• 服务器向客户端数据发送完了之后，服务器端向客户端发送TCP释放连接请求；
• 客户端收到服务器断开请求后，进入TIME-WAIT(时间等待)状态，需要经过时间等待计时器（TIME-WAIT timer）设置的时间2MSL(时间MSL叫做最长报文段寿命)后，客户端才关闭连接，关闭从服务器端到客户端的连接。

问题一: 这里为什么是断开连接是四次呢？
因为TCP是全双工通信机制，也就是双向同时通信。

问题二：为什么客户端要在TIME-WAIT状态等待2MSL(2个最长报文段寿命）呢？
第一，保证客户端发送的最后一个确认关闭连接的报文可以到达B。这个确认报文有可能丢失，B会超时重传关闭连接的请求，客户端就可以在2MSL 时间内收到这个重传的报文，然后客户端再重传一个确认报文，重启2MSL计时器，最后客户端和服务器端都正常进入CLOSEED状态。如果A在TIME-WAIT不等待一段时间，而是发送完释放连接的确认后立即释放链接，那么如果出现错误时，客户端无法收到服务器端的重传报文，服务器端就无法按照正常步骤进入CLOSED状态。
第二，经过2MSL可以本连接持续的时间内所产生的所有报文段都失效从网络中消失，使下一个连接中不会出现这种旧的连接请求报文段。

从输入URL到 页面渲染完毕，发生了什么

1. 浏览器解析域名，将URL解析，获得对于服务器的IP地址；
2. 浏览器与远程服务器通过TCP三次握手建立连接连接(TCP三次握手)；
3. 建立连接后浏览器会通过HTTP GET请求页面资源
4. 远程服务器收到请求，会做逻辑操作，查找数据库，读取文件，将资源并通过http响应返回资源；
5. 浏览器开始下载页面资源，浏览器对返回HTML资源进行解析渲染；
6. 浏览器会将HTML解析生成DOM tree，将css解析生成CSSOM，将DOM tree和Css tree合并生成render tree（:after和:before这样的伪元素会在