缓存系列

强缓存和协商缓存
区别是使用本地缓存的时候，是否需要向服务器验证本地缓存是否依旧有效。
协商缓存，就是需要和服务器进行协商，最终确定是否使用本地缓存。

强缓存

强缓存主要是通过http请求头中的Cache-Control和Expire两个字段控制。ExpireExpire是HTTP1.0标准下的字段，在这里我们可以忽略。我们重点来讨论的Cache-Control这个字段。
一般，我们会设置Cache-Control的值为“public, max-age=xxx”，表示在xxx秒内再次访问该资源，均使用本地的缓存，不再向服务器发起请求。
如果在xxx秒内，服务器上面的资源更新了，客户端在没有强制刷新的情况下，看到的内容还是旧的。

协商缓存

协商缓存最大的问题就是每次都要向服务器验证一下缓存的有效性，似乎看起来很省事，不管那么多，你都要问一下我是否有效。

缓存实践

缓存的意义就在于减少请求，更多地使用本地的资源，给用户更好的体验的同时，也减轻服务器压力。所以，就应该是尽可能命中强缓存，同时，能在更新版本的时候让客户端的缓存失效。

webpack可以让我们在打包的时候，在文件的命名上带上hash值。如果资源未改变，文件名不改变，会使用缓存。否则会重新进行加载文件。

HTML：使用协商缓存。
CSS&JS&图片：使用强缓存，文件命名带上hash值。

转载自：https://juejin.im/post/5c136bd16fb9a049d37efc47