# 背景

js、css、图片等静态资源在每次网络请求占用不少时间，考虑使用cdn进行加速，找到了jsdelivr，它可以自动加速github资源的访问，并且可以免费使用，只需要很简单的操作就可以在vuepress用上。

# 操作方法

下面例子，我只对图片、js、css进行了加速。在config.js中插入如下代码即可。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

//加速静态资源
configureWebpack: () => {
  return {
    output: {
      publicPath: 'https://cdn.jsdelivr.net/gh/srcrs/srcrs.github.io@gh-pages/docs/'
    },
    resolve: {
      alias: {
        'docs': path.resolve(__dirname, './docs'),
      }
    }
  }
}

# 解释

• https://cdn.jsdelivr.net 代表网站根目录

• gh 代表github，应该也可以对其他代码托管网站加速资源访问

• srcrs 代表github用户名

• srcrs.github.io 代表仓库名

• gh-pages 代表仓库中的哪个分支

• docs/ 代表具体的目录

# 结果

静态资源加速效果明显，体验更加好了，又能愉快的看博客、写博客了。

# 后续

pwa会导致博客内容更新速度很慢，上传了很久都没有弹出更新按钮，故在删除这一功能。