前言

相信通过阅读前两篇文章,聪明的你已经搭建完成了你自己的博客,先给你点一个赞。但是你可能会发现,自己的博客打开速度很慢,图片也要加载很久,你疑惑地挠了挠头,无奈的摊开双手,叹道“这咋办么”,别叹气了,今天我就教你,怎么样给自己的博客减减肥,提提速。

基础提速

提速有很多常见的手段,这些最基本的提速,我想我应该最先告诉你。

图片瘦身

图片未经压缩直接上传是新手造成网站缓慢的最常见原因之一,试想一下,单张图片动辄几兆,加载起来自然就很慢了,所以给图片瘦身是很有必要的。

给图片进行瘦身我将其大概分为两种方式:
1. 上传前压缩,这个很简单,你只需要在上传图片之前对图片进行压缩就可以了。
2. 上传后压缩,可以借助一些压缩图片的插件,对图片进行压缩,这类的插件有很多,如果你真的让我推荐的话,我随便推荐一手 EWWW Image Optimizer ,之所以说是随便推荐,因为我向来都是在上传前就进行了压缩,并且这种图片压缩插件,其实都差不多,大多都支持在上传时就进行压缩。

JS,CSS 压缩

如果是有了解过前端的你,你肯定知道有很多js文件都提供了min版本,这就是压缩之后的版本,而我们的js应该怎么处理呢?你可以F12看一下你的网站在加载的时候哪些js/css文件比较大,然后找到它,百度找一个js在线压缩工具,将你的js压缩一下,压缩与不压缩,差距还是很大的。想一下,你的站点需要加载500KB的文件,而我只需要100KB,速度差,是不是就体现出来了呢。

进阶提速

缓存优化 By W3 Total Cache & Memcached

聪明的你,想必已经知道自己的文件需要压缩,但你有没有想到自己的文件也需要被缓存呢?我想你应该想到了,当然我更希望你没有想到,因为这样,你会更需要这篇文章。

如果你有了解过wordpress加速的相关文章,你可能会看到一些博主为你推荐使用插件进行缓存,好马配好鞍,优秀的你的博客,当然也要配上优秀的插件才行。

在这里我推荐你使用 W3 Total Cache(以下简称W3) 这个插件,这也是我目前正在使用的插件。使用这个插件,需要你的服务器是一台独立的云服务器而不是虚拟主机(有关概念请查看从零开始的第一篇教程),如果你是虚拟主机的话,也可以使用这个插件,但是效果会差很多哦。我相信,你使用的肯定是高档的云服务器,那么让我们开始吧。

1. 安装 Memcached

你刚刚可能还在疑问,为什么使用W3插件,就必须要云服务器呢?现在我来给你解答一下,因为咱们需要安装Memcached,而虚拟主机是安装不了的(一般而言)。

聪明的你,肯定还记得在上一篇教程里面,我教你安装了一个巨好用的宝塔面板,现在我们又要用到它了(如果没有安装的话,我建议你读一遍《从零开始II》哦,当然如果你对Linux已经非常熟悉,就完全不必了)。

  1. 点击宝塔界面左侧的软件商店,在应用搜索框内输入 Memcached ,点击搜索,可以看到我们需要安装的插件。
    2019-12-31-16-34-47.png
    点击安装就可以了,如果勤劳的你想要手动修改配置,一定要先了解清楚每一项的意义(完全不需要修改任何配置)。

  2. 然后点击 已安装 ,可以看到咱们已经安装的程序,我们需要找到PHP》设置》安装扩展,如下:
    2019-12-31-16-37-15.png2019-12-31-16-38-16.png你需要安装Memcached扩展,其他扩展可以根据自己的需要安装,看不懂的,不要安装哦。

  3. 到这个时候Memcached的安装已经全部完成了,咱们可以进行下一步了。

2. 安装 W3 Total Cache 插件

安装插件比较简单,在后台搜索安装就可以了,如果提示 TooMuchRequest ,可以爬梯或者使用我提供的下载地址,我会将本文需要的部分资源集中提供一个下载地址,会放到后面。

W3 Total Cache 汉化

安装完插件之后,聪明的你可能又要挠挠头了,因为插件竟然是纯英文的,当然这对你来说都是小菜一碟,但是毕竟使用起来,不是很方便,所以我也会教你如何去汉化这个插件,很简单,不要担心过于复杂。

首先,你下载我提供的中文语言包,然后你将文件上传到你博客路径的 /wp-content/languages/plugins 目录下,就这么简单,惊喜么?

W3 Total Cache 设置

汉化完之后,我们使用起来就方便了很多,现在让我们开始进行配置吧。
不想打那么多字,你可以按照我的配置图来喔,如果你有别的需求,也可以自行修改。
1. 常规设置,点击左侧的常规设置,开始!
2019-12-31-16-55-51.png
2019-12-31-16-56-33.png
2019-12-31-16-57-5.png
2019-12-31-16-57-17.png
2019-12-31-16-57-27.png

  1. 页面缓存
    2019-12-31-16-58-11.png
  2. 压缩
    2019-12-31-16-58-51.png
  3. 数据库缓存
    2019-12-31-16-59-18.png
  4. 浏览器缓存
    2019-12-31-17-0-9.png2019-12-31-17-0-27.png

好了,到这里基本就完成了配置,其他配置需要你自己探索哦,对了,我还会提供给你一份我的配置文件(喜欢直接拉到最后的同学,你好机智),你直接在底部导入就可以完成配置了哦。
2019-12-31-17-2-5.png

使用 Content Delivery Network(CDN) 提速

你优化了文件体积,优化了缓存,可能你觉得自己的速度已经足够了,但是我想告诉你的是,多看我的博客,真的可以学到一些东西。

Content Delivery Network 即我们常说的cdn,为什么要做cdn,cdn有哪些好处,这个问题,我建议你可以先百度一下,我只需要告诉你,它很重要。

既然很重要,那么事不宜迟,我这就开始讲(开心),在开始讲述之前,我想将这部分内容分为两个部分,分别是HTTP和HTTPS,
为什么要这样进行划分呢?因为大多数cdn可能会提供免费的HTTP cdn加速,比如七牛云,而https免费加速的,目前只有百度云加速。因为我自己也在用这两家的产品,所以我推荐你使用。

使用七牛云对象储存进行加速

  1. 首先注册/登录七牛云,点击跳转七牛云登录
  2. 因为七牛云的文档已经非常详细,我就懒得赘述了,你可以按照指引操作,如果有疑问,再回来提问 cdn加速文档
  3. 需要注意的是,七牛云的HTTPS加速,是不计入免费流量的,所以如果你需要免费的https的加速,你需要继续往下一节百度云加速看。
  4. 聪明的你,可能由于缺少经验的原因产生某些疑问,也许就在我下面的解释中哦。liudank.cn 这里我建议你选择七牛云储存,当访问找不到资源的时候,去七牛云储存里面获取,你可能会问,我的图片没有在七牛云储存里面怎么办,不要着急,还记得我让你安装的WPJAM插件么,打开它,设置cdn加速(作者有很详细的教程,我不赘述)。如果你的cdn加速里面没有七牛云选项,那么你需要进行一些简单地处理才行,这部分内容我会放到后面说。

使用百度云加速对HTTPS站点进行加速

百度云于2019年11月开放了https的免费加速,可谓是良心,虽然节点不多,但是总比直接访问服务器要好一些。而且百度云是每天提供10G免费流量,对于我们的博客来说,肯定是已经足够了。
1. 首先注册/登录百度云加速,点击跳转百度云加速
2. 点击控制台,进行实名认证。
3. 点击我的网站》添加网站,输入你需要加速的域名,接入方式选择CNAME。
2019-12-31-17-32-15.png2019-12-31-17-32-54.png
4. 查看需要解析的域名
2019-12-31-17-34-52.png
5. 前往服务商去进行对应的解析,如何解析域名,我想聪明的你肯定已经通过百度搜索知道了。
6. 上传你的https证书,或者申请一个新的证书。这里有一份详细的教程
7. 相信你已经成功部署了ssl证书,那么我们点击左侧的安全功能》HTTPS 选择加速模式,如果你的服务器上面也部署了这个证书,那么我们选择全程加密,如果你没有在服务器上部署的话,那么你就选择半程加密。
liudank.cn
8. 完成以上操作后,我们就已经接入了百度云的cdn加速。可能思维活跃的你,可能会去ping一下你的网址,发现已经变成了不认识的ip,恭喜你,已经接入生效了喔(没有变也不要着急,等待十分钟左右即可)。

增强提速

通过这篇文章,我们对文件自身的体积进行了优化,对缓存进行了优化,然后又对访问速度进行了优化,我们已经基本完成了网站的优化,还有一些针对性的优化,比如去优化代码的效率,去除主题里面的低效率代码,这些有些需要你自己去实现,而有些则可以通过优秀的插件去实现。

WPJAM_Basic

WPJAM Basic 是我爱水煮鱼博客多年来使用 WordPress 来整理的优化插件,主要功能,就是去掉 WordPress 当中一些不常用的功能,比如文章修订等,还有就是提供一些经常使用的函数,比如获取文章中第一张图,获取文章摘要等。

如果你的主机安装了 Memcacached 等这类内存缓存组件和对应的 WordPress 插件,这个插件也针对提供一些针对一些常用的插件和函数提供了对象缓存的优化版本。

作者提供的教程已经十分详细了,但是由于某些原因,作者停止支持七牛云的cdn,仅部分老用户还能继续使用。细心地你肯定也发现了我写的对象储存是基于七牛云的,那咋办呢?不要担心,我们需要进行一些小的修改。

/*
* 1.打开宝塔面板>文件>站点目录 /wp-content/plugins/wpjam-basic/admin/pages
* 2.找到 wpjam-cdn.php 文件,点击编辑
* 3.删除以下代码
*/
    if(!wpjam_cdn_get_setting('use-qiniu')){
            unset($cdn_options['qiniu']);
        }

这样,我们就可以使用七牛云CDN了,下面是使用说明:
1. 填写你的加速域名

liudank.cn

  1. 填写你的本地域名(当前博客的),如果你之前有用别的cdn,也需要在下面填入
    liudank.cn

  2. 设置远程图片规则
    liudank.cn

  3. 图片设置,建议开启
    liudank.cn

  4. 水印,按需求设置
    liudank.cn

将七牛云cdn教程补全之后,就没有什么遗漏的了,其他的作者都有提供很详细的教程。

大功告成,干杯!

通过上面的操作,我们完成了对网站的优化,看一下,你的网站生成速度是不是已经降到0.1S以下了呢?很高兴能够帮到优秀的你,如果你也很高兴收获到了一些干货,那我就可以宣布,这次交易无内鬼!如果还有其他疑问的话,欢迎在博客下面留言,或者一折加入我的 知识星球 来进行提问(试运营期间,巨幅优惠)。手机亦可以使用微信或知识星球App扫描下面的二维码加入。
liudank.cn

资源下载地址

点击跳转下载
提取码:jeir

《从零开始搭建个人博客III》——给你的网站提提速 《从零开始搭建个人博客III》——给你的网站提提速

没啥技术的程序员,每天只会生产bug