2025 年把 Typecho 优化到飞起
众所周知,网站的加载速度除了服务器的高配置和高带宽,剩下的就是对程序的优化了,2023 年初趁着刚转阴的这段时间身体状态尚可,我对 WordPress 和 Typecho 进行了一番优化,让网站的加载速度起飞。
本文先介绍一下 Typecho 的优化过程和技巧。
缓存系统-PHP OPcache
PHP 有自身的缓存扩展,比如 PHP OPcache,它可以将 PHP 脚本预编译的字节码存储到共享内存中来提升 PHP 的性能,存储预编译字节码的好处就是省去了每次加载和解析 PHP 脚本的开销,对于 Typecho 或 WordPress 来讲,这是必然要开启的东西,会直接降低 CPU 的使用率。
缓存系统-Redis Tpcache
Redis 与 Memcache 是一个性质,都是基于内存的缓存系统,而 Redis 是一个开源的数据结构服务器,使用 Typecho 的 Tpcache 插件搭配服务器的 Redis Server 可以有效的降低 MySQL 数据库的请求数量,从而让用户加载页面的时间降低。
不必担心 Redis Server 占用内存,小站用 256M 的内存空间就够了,也可以把 PHP 的 Sessions 存至 Redis Server,内存的读取写入速度比 SSD/HHD 硬盘快的不是一个量级。
缓存系统 - 静态化
静态化基本就跟 PHP 和数据库没有关系了,可以理解为如果服务器卸载了 PHP 和 SQL 系统(Typecho 的 MySQL 或 SQLite),但文章如果已经生成纯静态化的页面,用户依旧可以访问到正常到的内容,搭配后面讲的 CDN,即使服务器挂掉,只要文章已经生成了纯静态,都不影响用户的访问。
优点:速度极快,可以让 CDN 直接缓存,访问者不用读取数据库;
缺点:无任何交互,一旦交互(比如统计访问次数或访客留言等),都得写入数据库。
纯静态化的方式不建议 1,000PV/日的网站使用,因为没有必要,过度的优化不仅增加了自己维护的时间成本,而且降低了用户的浏览体验,不如把这些时间用在创作上。以 SEO 的角度来讲,当网站的内容成为用户刚需的时候,比任何的优化都有成效。
纯静态只适合已经有大量访问的网站或对交互无要求的网站使用,不用搭配 OPcache/Redis Server,不推荐访问量较低的网站使用。
缓存系统-ServiceWorker
ServiceWorker 相当于浏览器和服务器之间的中间人角色,目的是缩短页面加载资源的时间并降低用户可感知的延时。对于提升应用的加载速度常用的手段有 Http 缓存、异步加载、304 缓存、文件压缩、CDN、CSS Sprite、开启 GZIP 等等。这些手段无非是在做一件事情,就是让资源更快速的下载到浏览器端。
ServiceWorker 是一个独立的缓存方式,并不仅仅服务于某些应用,比如基于 PHP 的 Typecho 或 WordPress。有些主题已经自带了 ServiceWorker 的 API(比如 handsome 等),而有些主题需要自己配置。
总之,ServiceWorker 依托于用户的浏览器缓存,不会对服务器造成压力,推荐站长优先选择此方式。
静态资源 - 云存储+CDN
CSS/JS/图片(包含但不限于ICO、JPG、PNG、GIF、SVG、WEBP、AVIF等)基本是一个网站很少去更改的静态资源,当网站真正处于生产环境后,管理者通常只进行内容的创建和修改,并不会对这些静态资源进行更新,所以最好就是将这些静态资源放在云存储环境,比如腾讯云的COS或阿里云的OSS,然后进行CDN缓存(内容分发网络),这样,用户无论在全国任何地方访问这些资源,获取到的都是距离自己最近节点的,从而加速了网页的加载速度(国外常用的CDN是CloudFlare等)。
这样就让带宽很小的服务器容纳更多的用户访问,因为静态资源早已缓存至 CDN(请根据需求合理配置 CDN 的缓存,博主将 CSS/JS/图片等设置的缓存时间是 30 天),用户访问时并不会直接占用服务器的带宽,而是第三方 CDN 的流量和请求次数。
主流 CDN 已经支持动静分离或全站 CDN 加速,可能叫法不一样,但全站加速的效果要比单纯静态 CDN 的效果好,有条件的站长可以尝试。
2023 年国内主流 CDN:阿里云、腾讯云、七牛云、又拍云、金山云、华为云、火山云、百度云、360 云等。价格相差不大,某些有免费的基础流量包,但一定要根据网站的服务对象选择。比如网站的访问群体大部分在当地,那就选当地边缘节点多的;访问群体大部分在国内,那就选国内每个省份都有数个节点覆盖的;访问群体大部分在海外,直接无脑选择 CloudFlare、CloudFront 等,然后在 DNS 解析里根据访问者的位置 cname 到不同的 CDN 服务商,这种 CDN 分流操作可以有效提升全球访问者的速度。
程序 - 精简代码
当一个程序投入到开发环境的时候,默认的代码可能已经高于用户需求,就如同现在的智能手机有 80% 的功能我们都用不到。这时我们就需要去手动精简程序的代码,把用不到的代码去掉。比如某些网站用不到评论系统,那就直接去掉评论系统的调用,从而让程序跑起来更快。如果你对代码一窍不通,那就不建议选择此方式,因为一旦改动代码,可能出现的问题比追求极致的速度产生的负面影响更大。
程序 - 压缩代码
压缩代码不存在精简代码产生的负面影响,因为压缩代码只是把页面格式化好的代码进行了压缩,压缩后的代码不太容易让人手动分析,但是却减少了页面的大小,从而让页面加载的速度更快。
本方法已经不太建议各位站长使用,因为搜索引擎蜘蛛在抓取页面的时候会抓取页面的代码,而错乱的代码对蜘蛛并不友好,有点得不偿失。现如今的网速也不在乎多的几 KB 代码,不追求极致浏览速度的站长放弃吧!
程序 - 压缩图片
许多站长会直接把文章搭配的图片上传至服务器,这是一个错误的做法,图片在未经压缩前的大小可能会在 1-5M,直接导致用户在浏览的时候占用过多的加载时间,而通过压缩图片的技术手段,在不影响质量的前提下,图片压缩完可能只有 50-200K,直接减少了几十 ms 乃至上百 ms 的页面加载时长。
所以上传图片的时候控制好大小是一门学问,博主用的是 TinyPNG 的图片压缩,优先将图片转成 svg、webp、avif 的格式使用,GitHub 上也有专用的插件,有兴趣的站长可以一试。
数据库-SQLite
Typecho 支持 MySQL 和 SQLite 两种数据库,MySQL 功能强大,但对访问量不高的网站来说效率低下,SQLite 不需要服务器安装任何 SQL SERVER,直接读取,从而让用户加载的时间降低。
SQLite 优点:访问数据库效率高
SQLite 缺点:同步写入数据库效率低
建议以展示为主的博客使用 SQLite,如果没有大量同步评论或大量同步写入,SQLite 比 MySQL 的效率要高很多。本站已经将 MySQL 转移至 SQLite。
其他优化 - 页面预加载 A
页面预加载本身是 Typecho 程序没有的功能,博主加入本功能其实就是引入了一个 instant.page 的 JS 文件,目的是让所有浏览者(包含手机浏览用户)将鼠标悬停在超链接上的时候,浏览器将自动预加载该超链接页面的 CSS/JS(内容除外),降低点击进入该页面时的加载时间。
可以在主题配置中加入<body data-instant-intensity="viewport">
,目的是手机浏览用户当访问该页面时自动预加载屏幕内的所有超链接(服务器配置低慎用)。
将以下内容添加至</body>
之前即可:
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/instant.page/5.1.0/instantpage.min.js" type="module"></script>
其他优化 - 页面预加载 B
flying-pages 的预加载方式比 instant.page 更夸张,其效果就是在页面打开后自动加载视窗内的所有超链接,也包含将鼠标悬停超链接时预加载页面。
优点:可定制预加载延时、忽略路径、最大请求数量
缺点:耗流量、访问次数及服务器资源
将以下内容添加至</body>
之前即可:
<script>
window.FPConfig = {
delay: 0, //启动延时
ignoreKeywords: ['/login','#'], //忽略路径
maxRPS: 1, //每秒最大预加载数量(悠着点,有可能耗尽 CDN 流量或服务器 CPU、带宽)
hoverDelay: 50, //鼠标悬停预加载延时
};
</script>
<script defer src="flying-pages.min.js"></script>
其他优化 - 程序 - 头像加载
Typecho 默认的 Gravatar 头像因为服务器在国外,所以加载速度极其缓慢,而国内大多数的主题可以设置把 Gravatar 替换为 Cravatar,这样不仅加速了国内的 Gravatar,而且还能解析出 QQ 邮箱的头像。
但后台评论用户依旧用的是 Gravatar,为提高后台头像的加载速度,找到/var/Typecho/Common.php
,将:gravatar.com
替换为 cravatar.cn
,便完成了后台评论头像的提速。
其他优化 - 证书-ECC
网站 SSL 证书已经普及,可证书也分为许多种,比如 RSA 和 ECC,大多数站长搭建宝塔环境默认使用 Let’s Encrypt 申请的是 RSA 证书,优点是兼容性强,无论手机还是电脑访问网站都不会出现问题。
但博主强烈推荐大家用 ECC 证书,可以手动用 acme.sh 申请,因为 ECC 密钥比 RSA 短,所以网络消耗相对 RSA 更低、加密速度更快、占用的 CPU 也更低。
喜欢尝鲜的站长可以试着体验 SSL 的 OCSP 装订技术,对 iOS 访问的效果会更加突出。
Nginx 启用 OCSP 装订技术的方式是将以下代码加入 Nginx 配置的http{
里即可:
ssl_stapling on; #启用 OCSP
ssl_stapling_verify on; #启用 OCSP 响应的验证
其他优化-Nginx-PageSpeed
早在 201X 年就用过 Apache 的 mod_pagespeed 模块,那时的服务器配置比较低,Apache 本身就占资源,而网站 PV 又高,最终放弃了 mod_pagespeed。
2025 年的服务器配置增强了不少,而 Nginx 的低占用又似乎可以使用 pagespeed 优化一下,主要的效果就是图片懒加载、WebP 格式图片输出、css/js 压缩合并输出,这样就可以丢掉一系列的插件,从而减轻程序导致的资源占用了。
ngx_pagespeed 的编译方式可以自行搜索,分享一下我的配置文件,将以下代码放入 Nginx 的http{
里即可:
# PageSpeed Begin
pagespeed on;
pagespeed FetchHttps enable,allow_self_signed,allow_unknown_certificate_authority,allow_certificate_not_yet_valid;
pagespeed PreserveUrlRelativity on;
#pagespeed ListOutstandingUrlsOnError on;
pagespeed CreateSharedMemoryMetadataCache /tmp/ramdisk 51200;
pagespeed DefaultSharedMemoryCacheKB 51200;
pagespeed FileCachePath /tmp/ramdisk;
pagespeed FileCacheSizeKb 2048000;
pagespeed FileCacheCleanIntervalMs 43200000;
pagespeed FileCacheInodeLimit 500000;
pagespeed RewriteLevel PassThrough;
pagespeed RespectVary off;
pagespeed LowercaseHtmlNames on;
pagespeed HonorCsp on;
pagespeed RedisServer "127.0.0.1:6379"; #若无 Redis 可删除
pagespeed ModifyCachingHeaders off;
pagespeed Disallow "*/wp-admin/*"; #过滤路径
pagespeed EnableFilters collapse_whitespace;
pagespeed EnableFilters remove_comments;
pagespeed EnableFilters rewrite_css;
pagespeed EnableFilters rewrite_javascript;
pagespeed EnableFilters combine_css;
pagespeed EnableFilters combine_javascript;
pagespeed EnableFilters inline_css;
pagespeed CssInlineMaxBytes 4096;
pagespeed EnableFilters inline_javascript;
pagespeed JsInlineMaxBytes 4096;
pagespeed EnableFilters elide_attributes;
pagespeed EnableFilters extend_cache;
pagespeed EnableFilters flatten_css_imports;
pagespeed CssFlattenMaxBytes 5120;
pagespeed EnableFilters lazyload_images;
pagespeed LazyloadImagesBlankUrl "lazyload.gif"; #懒加载图片 url
pagespeed LazyloadImagesAfterOnload off;
pagespeed EnableFilters resize_mobile_images;
pagespeed EnableFilters inline_preview_images;
pagespeed EnableFilters rewrite_images;
pagespeed EnableFilters inline_images;
pagespeed EnableFilters resize_images;
pagespeed EnableFilters recompress_images;
pagespeed EnableFilters convert_meta_tags;
pagespeed EnableFilters prioritize_critical_css;
pagespeed EnableFilters convert_gif_to_png;
pagespeed EnableFilters convert_png_to_jpeg;
pagespeed EnableFilters convert_jpeg_to_webp;
pagespeed EnableFilters insert_dns_prefetch;
pagespeed InPlaceResourceOptimization on;
pagespeed EnableFilters in_place_optimize_for_browser;
# PageSpeed End
其中,Cache 目录可以放进 Ramdisk,内存的读写速度相比 HDD/SSD 更加快速,重启消失。
其他优化-Nginx-Brotli
Gzip 可以压缩前端数据,而 Brotli 的压缩性能更优于 Gzip,可惜连宝塔在内的国内知名面板默认都不将 Brotli 编译在内。
编译方式可以自行搜索,分享一下我的配置文件,将以下代码放入 Nginx 的http{
里即可:
# Brotli Begin
brotli on;
brotli_comp_level 6;
brotli_types text/plain text/javascript text/css text/xml text/x-component application/javascript application/x-javascript application/xml application/json application/xhtml+xml application/rss+xml application/atom+xml application/x-font-ttf application/vnd.ms-fontobject image/svg+xml image/x-icon font/opentype;
brotli_static always;
# Brotli End
其他优化 - 传输协议-HTTP/3 QUIC
HTTP/3可以明显降低传输延迟(国内某些QOS的ISP可能会影响UDP传输稳定性),QUIC通过与TLS1.3的深度集成将传输和加密握手合并为一次往返,大大减少了建立连接所需的时间,详细配置不再赘述,Nginx最新版本可以无脑配置。
本站优化方式:PHP OPcache+ServiceWorker+ 云存储 + 全站 CDN+ 精简代码 + 图片压缩+SQLite 数据库 + 页面预加载 + 头像加载+ECC 证书+PageSpeed+Brotli+HTTP/3。
这是目前基于 Typecho 的优化配置,同样也适用于 WordPress 等一系列框架,无论任何网站,优化的逻辑都是相同的,有需求的站长可以借鉴(🥇博主提供有偿优化服务)。