01/13
2016

WordPress 博客速度优化,欢迎大家反馈访问速度

专属福利:购买阿里云服务器(及其他阿里云产品)可以用我的阿里云大使专属推荐链接八折优惠

 

从 2013 年初用这个独立博客开始,共进行了两次服务器迁移(bloghost 到 DigitalOceanDigitalOcean阿里云 ECS(附专属 8 折优惠链接))、三次性能优化(2013 年 10 月2015 年 5 月),trinea.cn 安装的插件可见:trinea.cn 一直在成长

 

这次优化后 Google PageSpeed Insights 评测结果已经比较满意了,网页版达到了 96。

博客是基于 WordPress 的,总结下到目前为止的优化:

一、前端

前端请求的资源主要包括 html 文本、Css、JS、图片。主要优化包括减少连接数、减少每次返回的资源大小、改变连接优先级。

1. 减少连接数

包括请求合并、图片合并(Css Sprite)、浏览器缓存。

 

通过 Better WordPress Minify 插件完成 CSS、JS 合并,几十个请求化为一个,减少这两类资源的请求数。 通过 Nginx 设置 Cache-Control 的缓存时间。

location ~* \.(?:ico|css|js|gif|jpe?g|png|swf|woff)$ {
    expires 30d;
    add_header Pragma public;
    add_header Cache-Control "public";
}

如果是 Apache,配置可见:2013 年 10 月优化

 

2. 减小资源大小

包括 Gzip 压缩、图片无损压缩。

 

通过 Nginx 设置 html、Css、JS Gzip 压缩级别等。

gzip on;
gzip_disable "msie6";

gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_min_length 256;
gzip_http_version 1.1;

gzip_types text/plain text/css text/x-component text/html application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/x-icon image/svg+xml image/jpeg image/gif image/png font/opentype;

如果是 Apache,配置可见:2013 年 10 月优化

通过 ImageOptim(Mac 版) 无所压缩图片或 https://tinypng.com/ 有损高比例压缩图片。

 

3. 按优先级、并发获取内容

JS 后置,通过 Better WordPress Minify 插件。
CSS import 用 link 等代替,目前采用的主题中有 Css 内 import Css 的情况,导致无法并发拉取内容,可直接替换内容或用 link 代替(可能有问题)。

 

二、后端

后端主要包括服务器本身性能以及程序处理。

1. 服务器优化

这次迁回国内主要也是因为 DigitalOcean 在国内不少城市访问速度过慢,甚至被屏蔽,在连接速度方面阿里云确实远远胜出。

阿里云 ECS(附9 折优惠链接) 只是普通硬盘,而之前的 DigitalOcean 则是固态硬盘,读取速度自然有差距,具体尚能测试对比。

 

2. WordPress 优化

主要通过缓存将动态网页请求改为直接取静态缓存内容,其他优化可见性能优化系列介绍
通过更高效的 W3 Total Cache 插件完成静态缓存,替换了之前的 WP Super Cache 插件。

 

W3 Total Cache 设置中有 Page Cache、Database Cache、Object Cache 等,对应的 cache method 默认为 Disk。可通过安装 memcached 及 php5-memcache(注意不是 php5-memcached) 增加对 memcached 的支持,选择相应的 cache method 为 Memcached 提高性能。

 

专属福利:购买阿里云服务器(及其他阿里云产品)可以用我的阿里云大使专属推荐链接八折优惠

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

6 thoughts on “WordPress 博客速度优化,欢迎大家反馈访问速度