免费cdn加速推荐(jsDelivr+Github如何实现CDN加速)

免费cdn加速推荐,jsDelivr+Github如何实现CDN加速。

序言

个人采用hexo搭建了博客,博客也刚上线不久,虽然放到了云服务器上,但是由于博客上传的图片等资源越来越多,请求的资源也越来越多,博客访问速度越来越慢,简直不忍直视。

愁了好久,一直在想办法优化,自己在网上也找资料,在和博客交流群的小伙伴交流后便有了解决方案,【使用cdn加速】。

但是呢问题又来了,很多云服务提供商的cdn加速都是要根据流量花钱的。虽然网站访问量不多,但是呢能白嫖当然是最好的了。

在小伙伴推荐后有了两种白嫖方案 1、jsDelivr+Github 2、又拍云(需要申请账号加入又拍云联盟,个人的申请还未下来)。都说又拍云加速会更好一些,但是自己的申请还没办好,而博客访问优化又迫在眉睫,固先采用了第一个方案:jsDelivr+Github 的方案。

下面就以jsDelivr+Github 实现免费cdn加速为例,记录自己优化过程。

1 cdn简介

cdn 全称Content Delivery Network即内容分发网络。

CDN是一组分布在多个不同地方的WEB服务器,可以更加有效的向用户提供资源,会根据距离的远近来选择 。使用户能就近的获取请求数据,解决网络拥堵,提高访问速度,解决由于网络带宽小,用户访问量大,网点分布不均等原因导致的访问速度慢的问题。

2 cdn请求分发原理

如何使用jsDelivr+Github 实现免费CDN加速?

cdn分发原理图

(1)用户向浏览器提供需要访问的域名;

(2)浏览器调用域名解析库对域名进行解析,由于CDN对域名解析过程进行了调整,所以解析函数库一般得到的是该域名对应的CNAME记录,为了得到实际的IP地址,浏览器需要再次对获得的CNAME域名进行解析以得到实际的IP地址;在此过程中,使用的全局负载均衡DNS解析。如根据地理位置信息解析对应的IP地址,使得用户能就近访问;

(3)此次解析得到CDN缓存服务器的IP地址,浏览器在得到实际的ip地址之后,向缓存服务器发出访问请求;

(4)缓存服务器根据浏览器提供的要访问的域名,通过Cache内部专用DNS解析得到此域名的实际IP地址,再由缓存服务器向此实际IP地址提交访问请求;

(5)缓存服务器从实际IP地址得到内容以后,一方面在本地进行保存,以备以后使用,二方面把获取的数据放回给客户端,完成数据服务过程;

(6)客户端得到由缓存服务器返回的数据以后显示出来并完成整个浏览的数据请求过程。

3 jsDelivr简介

是一个免费、快速和可信赖的CDN加速服务,声称它每个月可以支撑680亿次的请求。服务在Github上是开源的,jsDelivr地址 。目前,它提供了针对npm、Github和WordPress的加速服务,只需要一行代码就可以获得加速效果。只要我们的项目中用到了第三方的静态资源,譬如JavaScript脚本,css样式表,图片,图标,Flash等静态资源文件都应该考虑接入到CDN中

4.jsDelivr 的简单使用

我们以加载jQuery和Bootstrap 为例

// load jQuery v3.2.1
https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js
// load bootstrap v4.4.1
https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/js/bootstrap.js

jsDelivr + Github便是免费且好用的CDN,非常适合博客网站使用

5 jsDelivr + Github 的具体实现

5.1 新建Github仓库

如何使用jsDelivr+Github 实现免费CDN加速?

5.2 使用git clone 命令将仓库克隆到本地

如何使用jsDelivr+Github 实现免费CDN加速?

在要放仓库的本地目录右键 Git Bash Here(如果没有安装git的需要提前安装下,都是默认安装即可),并输入以下命令

git clone https://github.com/xiezhr/mycdn.git
$ git clone https://github.com/xiezhr/mycdn.git
Cloning into 'mycdn'...
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (3/3), done.

5.3 将需要cdn加速的资源上传到github仓库

需要用到的命令如下

git add .                     //添加所有文件到暂存区
git status                    //查看状态
git commit -m '第一次提交'      //把文件提交到仓库 -m 后面的是备注信息
git push                      //推送至远程仓库

个人采用的是hexo博客框架,该框架的静态资源(css、js、图片等)都是放在source目录下面,所以呢我是将source目录真个上传上去,这样的好处是路径跟原来的保持一致,后面在调用的时候比较方便。

如何使用jsDelivr+Github 实现免费CDN加速?

git 窗口输入如上命令之后,文件都上传到了github仓库

如何使用jsDelivr+Github 实现免费CDN加速?

5.4 点击release 发布版本

如何使用jsDelivr+Github 实现免费CDN加速?

自定义发布版

如何使用jsDelivr+Github 实现免费CDN加速?

5.5 通过jsDelivr引用资源

通过如下地址应用资源

https://cdn.jsdelivr.net/gh/你的用户名/你的仓库名@发布的版本号/文件路径

举个栗子,获取source/bgimg路径下的back-rain.png

https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/bgimg/back-rain.png       ## 获取最新资源
https://cdn.jsdelivr.net/gh/xiezhr/mycdn@1.0/source/bgimg/back-rain.png   ## 获取1.0版本的资源

注意: 版本号不是必需的,是为了区分新旧资源,如果不使用版本号,将会直接引用最新资源,除此之外还可以使用某个范围内的版本,查看所有资源等,具体使用方法如下:

// 加载任何Github发布、提交或分支
https://cdn.jsdelivr.net/gh/user/repo@version/file

// 加载 jQuery v3.2.1
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js

// 使用版本范围而不是特定版本
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js   https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js
 
// 完全省略该版本以获取最新版本
https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js
 
// 将“.min”添加到任何JS/CSS文件中以获取缩小版本,如果不存在,将为会自动生成
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js
 
// 在末尾添加 / 以获取资源目录列表
https://cdn.jsdelivr.net/gh/jquery/jquery/

6 将hexo中用到静态资源的地方换成cdn加速

# 使用到的前端库,可按需替换成对应的CDN地址,如果下面未指定具体的版本号,使用最新的版本即可.
# 注:jsdelivr可以自动帮你生成.min版的js和css,所以你在设置js及css路径中可以直接写.min.xxx
libs:
  css:
    matery: https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/css/matery.css
    mycss: https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/css/my.css
    fontAwesome: https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/libs/awesome/css/all.css # V5.11.1
    materialize: https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/libs/materialize/materialize.min.css # 1.0.0
    aos: https://cdn.jsdelivr.net/gh/xiezhr/mycdn/source/libs/aos/aos.css

都换好之后,执行如下命令

hexo cl & hexo g & hexo s

浏览器地址栏输入 http://localhost:4000 访问博客,你会发下博客访问速度快了很多。到此大功告成!

(0)
一百大叔的头像一百大叔注册用户

相关推荐

  • 2023,长租公寓的自我修复

    长租公寓期待已久的收获期,或许正在靠近。魔方生活向资本市场迈出关键一步,继去年9月份向港交所递交上市招股书失败之后,二次递交了申请,虽然目前还未通过聆讯,但证监会官网在8月底发布了备案通知书。如果进展顺利,魔方很可能成为港交所*家长租公寓上市公司。除此之外,自如递表的传言也未间断,这是长租市场头号选

    2023年10月8日
  • 怀孕最开始的征兆(怀孕的前兆是什么反应)

    怀孕最开始的征兆怀孕最早的症状首先就是停经,对于生育期有性生活史的健康妇女,平时月经周期都是规则的,一旦月经过期了,就应该考虑到妊娠,过70日以上,尤其应该高度怀疑妊娠。雌激素能促进子宫颈以及子宫内膜腺体分泌黏液,孕妇的阴道、阴部、子宫颈这

    2023年5月5日
  • 毕业生要预防这些求职心理误区,大学生常见的择业心理误区(八个大学生求职心理误区)

    毕业生要预防这些求职心理误区 毕业生要预防这些求职心理误区 写简历:只从自己的立场出发 有一位云南某大学的应届毕业生,大学4年得了很多第一。他觉得自己条件十分优秀,一心想去外企,简…

    职场 2021年12月13日
  • (最新)沈星辰顾明尧小说完整版免费阅读

    主角是沈星辰顾明尧的完整小说上线啦!小说很好看,但是结局是意外。每几章可以看做一个独立的故事,但是又有主线人物串起来。“院长,我要出趟任务,不知道什么时候才能回来,家豪还是拜托您多照顾,李医生说他要等到十六岁才能装假肢,我的钱会以我个人名义存在军区财务那儿,期间他的所有生活费、学费和医疗开支,只要您跟财务的小唐说一声就能取钱。”“另外……等他好了些后,麻烦您带他去星辰墓前看看。”听到他这些的安排,院长像是知道任务的危险性,语气凝重:“放心,顾团长。”…

    美文 2023年6月30日
  • 刘飞***全文阅读 刘飞***小说最新章节

    刘飞***是著名作者花轮同学h写的一本小说里面的主角。本文运用了比喻 、拟人等修辞方法,增强表现力。看完你就会觉得是一本与众不同的小说!咱们接着往下看被自己的青梅竹马退婚,又被绝色美女总裁认亲,刘飞彻底的惊呆了。“叫爸爸。”“检测到宿主的亲生骨肉,好爸爸觉醒!”

    2023年10月20日
  • 女孩柔美的名字

    1、甜夏2、毓芷3、瑜弘4、晴迎5、惠雁6、文缨7、逸觅8、新芳9、岚曦10、芷妞11、洁盼12、苛菡13、婕蓉14、馨思15、美桂16、雪春17、海曜18、冰怜19、菲裳20、影茗21、菏悦22、

    2024年2月5日
  • 日落胭脂红无雨必有风全诗(日落胭脂红无雨也有风)

    大家好,本篇文章为大家解答以上问题,相信很多人对日落胭脂红无雨必有风全诗都不是特别的了解,因此呢,今天就来为大家分享下关于日落胭脂红无雨必有风全诗以及日落胭脂红无雨也有风的问题知识,还望可以帮助大家,解决大家的一些困惑,下面一起来看看吧!

    2023年8月2日
  • 沈澜汐季南砚结局-重生沈家被万家陷害的小说免费阅读小说完整版在线阅读

    精选热书《重生沈家被万家陷害的小说免费阅读》由知名作者佚名所编写的重生风格的小说,文中主角是沈澜汐季南砚,小说文笔成熟,故事顺畅,阅读轻松。主要讲述代安也不知道说什么好,这沈家大爷好大的胆子,这种话也敢乱说,不过也是奇怪,好端端的,沈家大爷怎么会无缘无故说这样的话,事情定是没这么简单。“我大伯说是听人说的!”沈澜汐说着双目一睁,大伯定是被人给利用了,该死的。

    美文 2023年4月24日
  • 苏灵李寒光全文免费阅读-惨死三世,女配摆烂后他们都慌了完整无删减

    人气小说《惨死三世,女配摆烂后他们都慌了》由知名作者黑眼圈仙人所编写的古代言情风格的小说,文中主角是苏灵李寒光,书中感情线一波三折,却又顺理成章,整体阅读体验非常不错。下面看精彩试读:苏灵穿成了大女主修仙文中的恶毒女配师妹,书中她是男主未婚妻,在女主的引导下不断作死后惨死。小说中女主安如烟身中情咒是个黑莲花万人迷,男主男配们个个爱她,女主在欺骗了他们的感情后将他们都杀了。苏灵重生三世,每一世都想阻止男主男配们惨死的结局,但每一世他们都只相信女主,然后将她一剑杀死。第四世,苏灵心态崩了,她决定放下助人情节,尊重他人命运,开局退婚摆烂了!手握咸鱼系统,抢夺女主机缘,狂怼男主男配们,救下小可怜师弟,捡个贱猫当灵宠,带宗门大赚灵石成了全宗长老团宠。正当苏灵浪的飞起时,女主情咒失效了!当男主男配们回忆起了前三世的全部,他们崩溃的发现,这一世师妹居然不管他们死活了?!而苏灵也懵逼了,师尊师兄们看她的眼神咋越来越不对劲?啥?还和女主打起来了?!等等,一定是我打开的方式不对,说好的全员女主舔狗呢?!你们人设崩了啊!!

    2023年12月24日
  • 人工智能板块相关股票 有前景的行业值得参考

    最近这一段时间,A股市场对于人工智能的关注度又高了起来,这篇文章就跟大家介绍几家做人工智能的上市公司! 博彦科技:目前,博彦科技BAI OPS智能运维解决方案已为高科技企业、大型公…

    创投 2022年1月25日
  • 开卷有益的作文400字左右(关于开卷有益的作文500字左右)

    各位网友们好,相信很多人对开卷有益的作文400字左右都不是特别的了解,因此呢,今天就来为大家分享下关于开卷有益的作文400字左右以及关于开卷有益的作文500字左右的问题知识,还望可以帮助大家,解决大家的一些困惑,下面一起来看看吧!

    2023年6月30日
  • 哪些话可以用数字代替

    大家好,今天小编来为大家解答以下的问题,关于哪些话可以用数字代替,很多人还不知道,现在让我们一起来看看吧!本文目录六六大顺的数字是什么有哪些包含数字的诗词句(我爱的)用数字代替应该是哪3个医疗本上的与户主关系是用数字代替的!那些数字代表了什

    2023年9月21日
  • 海外买房香港政策(购房海外)

    杨帆号:海外买房香港政策,以及购房海外对应的知识点记得收藏.本文目录一览:1、移民香港可以买上海房子吗2、哪个国家投资移民费用最低?3、买房可以申请香港移民吗?香港可以买上海房子吗1、如果您满足以上条件,可以按照相关流程申请香港人在上海买房。2、如果你是持有香港身份证,同时持有回乡证的。那么不管

    2024年2月4日
  • 退烧不必立竿见影

    持续多日的寒冷天气令本市各大医院儿科病人迅速增多,患儿以感冒发烧为主。医生在治疗过程中发现,很多家长不能科学面对孩子感冒发烧,总是认为到了医院看了医生做了治疗就应该立即退烧,一旦不是这样,就不断地来医院寻求再次治疗,结果反而加重了疾病,甚至

    2023年10月27日
  • 蒲公英怎么泡水喝最好(蒲公英泡水是直接晒干还是蒸熟晒干)

    蒲公英怎么泡水喝最好蒲公英可以泡水喝,泡的方法一般是用干燥的蒲公英草,很少用新鲜的蒲公英草。另外,蒲公英也不能天天喝,虽然说对于人体的功效极大,但是究竟是一种中药,饮用久了会损伤脾胃,导致不可逆转的后果。泡蒲公英的时候只要把蒲公英拿出来,在

    2023年5月21日

发表回复

登录后才能评论