Hexo+Github Pages个人博客CDN加速、优化博客的加载速度、提高用户体验

前言

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

优化加载速度

如何优化？选择什么优化方式？
使用 CDN 加速？
使用图床？
第三方托管在线 js 文件？

使用 JsDelivr

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

为什么使用 JsDelivr？

免费、稳定

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

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

JsDelivr CDN 加速

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

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

COPY

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

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

4.提交到 GitHub 仓库即可

COPY

# 添加全部内容文件到暂存区
git add .

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

# 提交到远程仓库
git push

注：由于我的仓库被 GitHub 官方人员禁用，导致失效

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

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

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

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