一 、启用 Gzip 压缩
考虑因素:
- 压缩比
- 压缩时间
通过 Nginx 配置可以启用 Gzip 压缩,压缩率可高达90%。
通过响应头 Content-encoding 可以查看所启用的压缩格式。
二、启用 Keep-alive
keep-alive 是用来复用 TCP 连接的,如此,与同一台服务器就不需要重新建立 TCP 连接了,从而节省了 Initial Connection。(见 Chrome Dev Tools Network timeline)。
在 HTTP 1.1 后的版本默认使用 keep-alive,在响应头 connection 中可以看到是否启用了 keep-alive。
keep-alive 有两个关键项需要配置(以 Nginx 举例):
- keepalive_timeout,连接超时时间,超过后则断开。
- keepalive_requests, 利用该连接可发起的请求数,超过之后则断开。
三、HTTP 缓存
提高重复访问时资源加载的速度。
- Cache-Control/Expires
- Last-Modified + If-Modified-Since,兼容 HTTP1.0
- Etag + If-None-Match
详细参考:HTTP Caching
四、Service workers
有两个作用:
- 加速重复访问
- 提供离线支持
Service workers 在客户端中建立起中间层,拦截发往服务端的请求,进行细粒度的缓存控制。
使用 Service workers 需要注意的事项:
- 延长了首屏加载时间,但页面总加载时间减少
- 兼容性问题
- 只能在 localhost 和 HTTPS 下使用
五、HTTP/2 的提升
优势:
- 二进制传输
- 请求响应多路复用
HTTP1 尽管也可以复用连接,但其实请求响应是有次序的;而HTTP2的多路复用可以做到一个连接上同时发起多个请求并接受多个响应,请求响应之间没有阻塞。 - Server push
Nginx 开启 HTTP2 的前提:
- Nginx1.10.0以上版本才支持Http2.0,如果使用的是Tengine,版本需要大于2.2.1
- Http2.0只支持Https协议的网站,且openssl版本需要高于1.0.2
六、服务端 SSR
好处:
- 加载首屏渲染
- 更好的 SEO
是否要使用SSR?
- 架构 - 大型,动态页面,面向公众用户
- 搜索引擎排名很重要