{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)

图片[1]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客


随着内容的多样化,使得我的博客开始变得笨重起来,网站打开速度远不如以前,因为我将它全部一体化了。

不得不让我开始对博客进行各项优化,目前使用Super Cache插件来完成动静分离的加载工作。

这是一个百度的教程,可能会有人觉得,百度有的,你为什么还要重复写?

万事都讲究一个新陈代谢,人们都喜欢新鲜的事物,百度上都是一些比较久远的旧内容,旧的WordPress,旧的插件,旧的CDN,旧的知识…

我就喜欢去研究一些几年前的东西,然后实践,最后写一份新的记录出来,供自己看,供大家学习。 🙁


一个声明

能不能复制我文章内容的时候,给一个出处?

不知从何开始,在各个引擎搜索我文章名,往往会出现“内容一样、图片一样”或者“内容相似、图片一样”的文章出来,无论是图片风格,还是写代码的风格,我一眼就看出来是复制我的,可恨的是根本没有转载自:月宅酱的声明!

转载声明起码是一个人的自我修为好吧?如果你要说你是伪原创,不是抄袭与复制,那麻烦请你把图片换掉,自己截!中吗,能不能别用我文章中的图。(我并不想在我的图片中打上水印,强迫症过不去) 💡


正式教程

老规矩,先在插件后台搜索安装wp super cache

老规矩,启用缓存,其他设置无所谓,本篇主要说CDN内容(然后直接点击CDN选项)

图片[2]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客


我这里是使用的又拍云来完成加速(需要备案,如果需要来自又拍云对象存储的加速,你可以下方评论,我会给予寄托,仅仅包括JS和CSS)

这里再啰嗦几点

  • 1.off-site URL 填写CDN地址,这里我填写的已经在又拍云绑定的域名“cdn.”,没备案, 直接填写默认域名,域名后面别写“/”
  • 2.目录的话,你可以写上全站,来达到你的admin后台也能加速,这里我只写了默认的两个,主要是加速主题文件
  • 3.默认是写的“.php”,这个意思是写在这里的任何的后缀,都不会被替换,这里表示不替换CDN上的php文件

然后点保存

图片[3]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客


第三步

接着你需要来到又拍云的FTP文件,上传刚刚的两个目录(不支持解压,请直接上传文件)

说一下为什么需要手动上传,而不是自动寄托过去?

这里加速存储的CDN内容,是又拍云的对象存储,而不是CDN节点服务器

对象存储的好处:能够达到100%的命中率,且无丢包,无需缓存,无需预热,直接拉取该文件

CDN的区别:必须有人访问之后才会被缓存到节点,也就是第一次命中率极低,之后才会加速

(修改文件后的js和css请在又拍云内直接修改,无需刷新)

图片[4]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客


最后一步

目前已经完成了CDN的工作,你可以来到你的主页,F12,点到Sources控制台,然后Ctrl+F5一下

你就会看见你的域名请求中多了一个cdn域名的加载

图片[5]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客

来看一下命中率与速度是怎样的吧,非常非常的吓人…… 😯

命中率和健康度由于是直接存在对象存储里,所以是100%,速度的话….加载有多少JS,就能一下子并发多少带宽出来…. ❓

图片[6]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客


注意

如果你把页面压缩这样了,那么地址的话…是不会被替换的,super cache只能替换绝对路径,我压缩成这样后,CSS变成相对路径,然后失效-0-所以,别压成这种没了绝对路径的代码,不然不会被加速的

图片[7]-{干货}利用WP Super Cache的CDN来挂载JS CSS(又拍云、七牛通用)-月宅酱的博客

最后说一下

你可以直接扔任何对象存储,记得手动上传,免费的一大堆,比如又拍云,七牛,腾讯,这些都是有免费额度,但是呢,七牛的https是额外计费的。由于我有又拍云联盟,所以我直接选择又拍云啦。

如果有什么问题与不懂,请在下面评论留言。

对了,我的邮件回复系统暂时出现问题,短时间内不打算修复,请在评论后的当天回来查看,我会在1分钟到12小时内回复你的!

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 共17条
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片
    • 月宅的头像-月宅酱的博客月宅等级-LV1-月宅酱的博客作者0
    • 月宅的头像-月宅酱的博客月宅等级-LV1-月宅酱的博客作者0