HTTP网络层的性能优化

HTTP网络层的性能优化

概览

性能优化 敏捷化平台（造轮子）

代码优化：代码编译

运行层：虚拟dom

HTTP优化

问题：从输入URL到看到页面，中间都经历了什么？

以此为依托去做每一步的优化

关键词：CRP渲染层原理

• URL解析

客户端和服务器端通信编码：

encodeURI: 能对空格 中文进行编码

encodeURIComponent: 能对http进行编码

URI URL URN的区别

缓存优化：性能优化的重点***

顺序：

1. 先检测是否存在强缓存，有且未失效就走强缓存；
2. 若无或已失效，走协商缓存；

强缓存 = 》 协商缓存

服务器发请求之前，先检测是否有缓存。

一般缓存位置：

内存：即内存条。浏览器一关闭，内存缓存就没了。

硬盘：即disk memory。

• 强缓存

后台设置，浏览器帮助我们实现，不需要我们自己去写代码。

是由服务器设置的，客户端是由浏览器完成的。

现在我们说的是资源缓存，redis是数据缓存。

1.1 - cache-control

1.0 - expires

强缓存：本地有且未过期，就直接从本地拿

更新策略

HTML不做强缓存

1. 1. webpack打包设置hash

1. 1. 末尾加个时间戳

• 协商缓存

last-modified

etag

协商缓存一定会向服务器发请求，由服务器根据文件是否更新决定

304没有任何信息。从本地拿资源文件，比不做缓存快很多

200带上资源文件

一般都是同时设

304协商缓存

200 强缓存或者重新拉取文件

强缓存性能会好很多

真实项目里2个都会设置

数据缓存

• DNS解析

域名解析

多服务器分布式 集群

web服务器：纯静态资源

数据服务器：业务逻辑压力大

音视频：

dns预获取：这也是性能优化点

DNS预获取：

同时加载dns 同时加载渲染

• TCP / IP

TCP是用来建立传输通道的，HTTP是用来送东西的

HTTP协议：HTTPS加了 SSL TSL，相对来说更安全

FTP：传输大文件

所以这里就有个性能优化点：

三次 四次都需要时间，所以这里就能connection: keep-alive

底层机制出发 找到性能优化点

http1.0 1.1 2.0对比

多路复用：多个请求一起

2.0比1.0 减少http重新发送 重新建立连接

汇总