传输加载优化
1. Gzip 压缩
- 对传输资源进行体积压缩，压缩比例可高达90%
- 使用Nginx启动Gzip
2. 开启keep-alive
- 一个持久的tcp连接，节省创建连接的时间
- Nginx默认开启keep alive
3. HTTP 资源缓存
3.1 Cache-Control（http1.1）
- max-age：（优先级高于expires） 在max-age这段时间内浏览器不会在向服务端发起请求，从缓存中直接读
- s-maxage：（优先级高于max-age）相较于max-age，s-maxage只能指定public的缓存
- private
- public：比如向cdn缓存就是public缓存
- no-cache：不管怎样都会向服务器发起请求，询问浏览器当前文件有没有在缓存策略里面过期
- no-store：不适用缓存
3.2 Expired（Cache-Control中的max-age的优先级高于Expired）（http1.0）
- 缓存过期时间，用来指定资源到期时间，是服务器的具体时间点
- 告诉浏览器在过期时间可以直接从浏览器缓存中读取数据，而无需再次请求
3.3 Last-Modified、If-Modified-Since（最小单位是 秒）
- 基于客户端和服务端的协商的缓存机制，客户端第一次向服务端发起请求时，服务端返回的respond head中会携带一个last-modified（文件最后修改时间），后面客户端在向服务端发起这个资源的请求时，每个request head中都会携带一些if-modified-since（第一次请求响应头中last-modified的值），服务端拿到 if-modified-since判断这个时间点文件版本有没有更新，如果没有更新则继续返回一个==304==，以及last-modified。如果已经有更新，则返回==200==，并返回最新的last-modified和最新你的资源。
- last-modified （response header）：文件的修改时间
- if-modified-since （request header）
- 需要与cache-control共同使用，max-age过期了才会进行协商缓存。
last-modified缺点：
- 某些服务端不能获取精准的修改时间
- 文件修改时间改了，但是文件内容却没有变
3.4 Etag、 if-None-Match（优先级高于Last-Modified、If-Modified-Since）
- ==文件内容的hash值==
- 也是基于客户端和服务端的协商的缓存机制，流程跟Last-Modified、If-Modified-Since一样。
- Etag（response header）
- if-None-Match （request header）
- 需要与cache-control共同使用，max-age过期了才会进行协商缓存。
3.5 资源缓存的策略：分级缓存策略
- 第一层是由expires/cache-control控制。只要没失效，浏览器之访问自己的缓存。返回状态码==200==
- 第二层有last-modified/etag控制。当第一层失效时或者用户==刷新==时，浏览器就会发送请求给服务器，如果服务端没有变化，则返回==304==。
- 当第一第二层失效时，浏览器直接下载最新的数据。并更新缓存相关的head。
4. Service Workers
4.1 作用
4.2 注意点
- 延长了首屏加载时间，但是页面总加载时间减少了
- 兼容性
- ==只能在localhost或者https下使用==
5. HTTP/2
- 二级制传输
- 请求响应多路复用
- server push
5.1 搭建http/2服务
