前言

都知道Github Pages搭建博客后,访问是非常慢,就连Github官网在大陆打开也是很慢,另外我们搭建的个人博客免不了在文章里添加图片,图片一多就会影响博客的加载速度,还有博客需要用到的js文件,每次都需要重Github博客仓库提取资源,总不能每张图片都要压缩内存大小后再上传吧?显然这不是我们想要的,我们要的是方便快捷。

优化加载速度

如何优化?选择什么优化方式?

  1. 使用CDN加速?
  2. 使用图床?
  3. 第三方托管在线js文件?
使用JsDelivr

他提供npm github wordpress资源的加速,在中国也有很多节点,速度很快。

为什么使用JsDelivr?

免费、稳定

不像某些图床网站,用了一段时间就跑路了,如何自己的图片也没了。

但是如果你使用的是JsDelivr,就算跑路(当然这是不纯在的),我们的图片依然有保留,因为我们图片等资源是保留再自己的Github仓库里的,所以无需担心

JsDelivr CDN加速

1.New一个新的Github 仓库,取名为CDN(当然这是自定义的)

2.将建好的仓库克隆到本地(在自己喜欢的文件加右键选择Git)

1
git clone https://github.com/lete114/CDN.git ### 这里是你的CDN仓库地址

3.把图片等资源都放进克隆下来的CDN文件夹下(分类,当人你也可以不分类,我习惯整理我的文件夹【强迫症😊】)如图:

4.提交到GitHub仓库即可

1
2
3
4
5
6
7
8
# 添加全部内容文件到暂存区
git add .

# 添加说明
git commit -m'第一次提交'

# 提交到远程仓库
git push

然后就可以访问:https://cdn.jsdelivr.net/gh/你的Github用户名/你的CDN仓库/文件文件夹/12.jpg
例如:https://cdn.jsdelivr.net/gh/lete114/CDN@3.0/BoBoPic/12.jpg

现在请你同时打开这两个地址做比较
GitHub:https://lete114.github.io/CDN/BoBoPic/01.jpg
JsDelivr:https://cdn.jsdelivr.net/gh/lete114/CDN@3.0/BoBoPic/12.jpg

这个就是本章开头的高清图片,加载速度是不是比Github的速度块?

细心的已经看到我的CDN后面怎么有个@3.0
解释一下:这是第3.0版本的图片,如果不写@3.0版本号的或就会适应当前最新的图片