WordPress+jsDelivr CDN开启伪全站CDN加速

释放双眼,带上耳机,听听看~!

img

我的博客的访问速度一直是个老大难问题,尽管各种优化手段都上了(Redis,OPcache,伪静态化,图片懒加载,GZIP)但是这些优化手段都不能从根本上改变我的博客访问速度慢这个事实

优化网站访问速度的最直接方法

减小首页体积

减少首页图片尺寸,我的博客打开一次就要2,3M,首页图片太大了,今天花了些时间把图片大小都优化了,直观的感受就是,真明显,网站大小才是打开速度的最大关键 还有CSS,JS大小的优化,但是并不推荐,容易网页出错

备案网站 站点放国内

网站放国内才是最优的解决办法,但是国内的ECS带宽都太小了,关键还是懒得备案,物理距直接决定网站访问速度

CDN

CDN有几种模式,一种全站CDN,没备案可以选择CF,但是CF国内访问太慢了。还有一种是部分加速,国内目前能够称之为优秀的免备案CDN只有jsdelivr

WordPress+jsdelivr CDN

CF的太简单,本文就不说了,网上教程应该遍地都是

本文就来说一说目前本站正在用的jsdelivr cdn+GitHub

教程开始

创建加速用仓库

首先在GitHub上创建一个仓库,创建wp-contentwp-includes这两个文件夹

img

.gitignore(没有就手动建)中添加*.php,提交文件时忽略php文件

WordPress安装WP Super Cache插件

WordPress安装WP Super Cache插件后,在cdn一栏,填入cdn地址,仿照我的格式来,最后别加/

**https://cdn.jsdelivr.net/gh/你的GitHubID/cdn仓库名@commit

img

jsdelivr cdn只能加速静态文件,所以要排除php

img

仓库目录

不是什么都要放到cdn上的,所以不能简单把wp-contentwp-includes文件夹直接填进去,我们需要针对性的,看我们的网页加载了那些内容,之后再分门别类的添加具体的文件夹目录

这是我添加的文件夹,英文逗号作分隔符

wp-content/themes/2020,wp-content/plugins/easy-table-of-contents,wp-content/plugins/q2w3-fixed-widget,wp-content/plugins/ajax-search-lite,wp-content/plugins/syntaxhighlighter,wp-content/plugins/autoptimize,wp-content/plugins/akismet,wp-content/plugins/jetpack,wp-includes/js,wp-includes/css

怎么看自己的网站加载了那些内容?

Chrome开发者模式查看网页加载项

img

所有域名为你网站域名的内容的css,js,这些都可以存储到cdn中,由于我已经都放到cdn上了,所有我博客下是没有直接从我服务器中拿的静态资源,自然也就看不得了

建议包括的目录

wp-content/themes/你正在用的主题目录
wp-content/plugins/你网页上加载的具体的插件目录
实在怕麻烦,就把整个wp-content/plugins都放进去,不推荐
wp-includes/js,wp-includes/css # WP自带的CSS,JS

uploads一定要排除,否则存储在你服务器上的图片会不显示。更新CDN内容

由于插件经常会更新,所以每次更新完插件后,都应该把该插件下载下来,提交到GitHub仓库中,并且由于jsdelivr的缓存是有延迟的,所以需要我们手动加速commit,来选择最新版本

img

在GitHub commits里能看到具体的commit号

img

img

img

添加到@之后就可以了

img

清除缓存

如果你之前就有在使用WP Super Cache,请务必清楚缓存,否则不会加载,并且会出错,配置好CDN后再生成缓存吧

img

最终效果

人已赞赏
WordPress教程

WordPress媒体库上传并预览webp格式的图片

2020-7-17 21:07:30

全系教程

编译 OpenWrt 系列 - 设备概览

2020-8-4 7:14:46

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索