页面缓存

虽然nuxt可以实现服务端渲染（ssr）, 这得益于虚拟dom可以让vue在脱离浏览器的环境下进行html的生成，从而实现服务端直出完整的html，达到 SEO 友好的目的。但同时也带来了一个问题，这需要消耗服务器额外的计算性能。所以，我们可以对页面做页面级别的缓存。核心就是当页面在第一次被渲染之后，将页面的计算结果缓存下来，然后在后续的一段时间内如果遇到相同的页面，则直接返回之前的缓存的页面结果,减少服务器在单位时间内重复的计算量。

安装 nuxt-ssr-cache

npm i nuxt-ssr-cache --save

配置nuxt.config.js

module.exports = {
  mode: 'universal',
  ...
  modules:[
    'nuxt-ssr-cache'
  ],
  cache: {
    useHostPrefix: false,
    pages: ['/'],
    store: {
      // 使用内存来存储页面内容
      type: 'memory',
      // 最多缓存100个页面
      max: 100,
      // 缓存时间，秒
      ttl: 60
    }
  },
  ...
}

在 modules 中增加 nuxt-ssr-cache 模块, 并且配置 cache 属性值即可生效，缓存页面的唯一标示是使用页面的url路径加query参数拼接在一起来表示唯一页面