ZBlogCMS 如何压缩网站静态资源

juming
juming 初级会员超兽战士
发布于 2026-10-08 03:08 ·2 浏览 ·0 回复

照着做一遍,你能把 ZBlogPHP 站点的 CSS、JS、HTML 传输体积压掉一半以上,首屏加载明显变快。

第一步:先量一下现在到底有多慢

压缩之前先拿到基线数据,否则你不知道优化有没有生效。

打开 Chrome,按 F12 进入开发者工具,切到 Network(网络) 面板,勾选 Disable cache,然后按 Ctrl+F5 强制刷新首页。看底部状态栏的 Transferred 总大小,以及每个 .css / .js 请求的 Size 列。

再点开任意一个 CSS 文件,切到 Headers 标签,看响应头里有没有这一行:

Content-Encoding: gzip

没有这行,说明服务器根本没压缩,所有文本资源都是原样传输的——这就是你要解决的核心问题。

注意:Size 列如果显示 (disk cache) 或 (memory cache),说明资源走了本地缓存,数字不准,一定要先勾 Disable cache。

第二步:在 Nginx 或 Apache 上开启 Gzip

Gzip 是收益最大的一步,通常能省 60%–80% 的文本体积。这一步在服务器层面做,比在 PHP 里做更稳。

Nginx:编辑站点配置文件(一般在 /etc/nginx/conf.d/你的域名.conf 或 /www/server/panel/vhost/nginx/ 下),在 server {} 块里加上:

gzip on;
gzip_min_length 1k;
gzip_comp_level 5;
gzip_types text/plain text/css application/javascript application/json image/svg+xml;
gzip_vary on;

保存后执行 nginx -t 检查语法,通过再 nginx -s reload。

Apache:在网站根目录的 .htaccess 里加:

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/css application/javascript application/json
</IfModule>

改完回到第一步的方法重新刷新,确认响应头出现 Content-Encoding: gzip。

注意:如果你用的是宝塔面板,网站 → 设置 → 配置文件 里改的是 Nginx 配置;面板自带的「网站 → 设置 → 网站目录」里没有压缩开关,别找错地方。

第三步:检查 ZBlogPHP 自带的压缩选项

ZBlogPHP 后台本身提供了一个输出压缩开关,但和上一步会冲突。

登录后台 /zbp/admin/(或你改过的后台路径),左侧菜单点 网站设置 → 全局设置,在表单里找到「启用 Gzip 压缩」之类的勾选项,勾上并点页面底部的 提交 保存。

注意:如果第二步已经在 Nginx/Apache 层开了 Gzip,这里就不要再勾。两层同时压会导致内容被压两次,轻则浏览器报错,重则页面直接白屏。二选一,服务器层优先。

第四步:合并压缩主题里的 CSS / JS

ZBlogPHP 的静态资源都在 zb_users/theme/主题ID/ 目录下,通常是 style/ 和 script/ 两个文件夹。这一步把它们瘦身。

先备份整个主题文件夹。然后在服务器上装 Node.js,用现成工具压缩(把 主题ID 换成你的实际目录名):

npx terser zb_users/theme/主题ID/script/common.js -c -m -o common.min.js
npx csso-cli zb_users/theme/主题ID/style/style.css -o style.min.css

压缩完确认页面显示正常,再把 .min 文件改名覆盖原文件。

注意:主题更新会覆盖这些文件,压缩成果会丢失。建议把压缩命令写成一个 .sh 脚本存着,主题升级后重跑一次。

第五步:给静态资源加缓存头

压缩解决「传得大」,缓存解决「传得勤」。在 Nginx 的 server {} 里追加:

location ~* \.(css|js|png|jpg|jpeg|gif|webp|svg|woff2)$ {
    expires 30d;
    add_header Cache-Control "public, immutable";
}

这样访客第二次访问时,这些文件直接从本地缓存读取,不发请求。

注意:加了 30 天强缓存后,你改了 CSS 访客也看不到新样式。每次改完静态资源,把主题模板里引用文件的 URL 后面加个版本号,例如 style.min.css?v=20240601。

小结

  • 压缩前先用 F12 的 Network 面板量出基线,重点看有没有 Content-Encoding: gzip。
  • Gzip 优先在 Nginx / Apache 层开,ZBlogPHP 后台那个开关只在服务器没开时才勾,别叠加。
  • 主题的 CSS / JS 用 terser、csso-cli 压一遍,压缩脚本要留存,防止主题升级覆盖。
  • 最后加 30 天缓存头,并配合 URL 版本号解决缓存不更新的问题。
版权声明:本文来自 GJ站长论坛《ZBlogCMS 如何压缩网站静态资源》
原文链接:https://www.gj0.com/thread-707.html
转载请注明出处并保留本声明;内容仅代表作者观点,与本站立场无关。若本文涉嫌侵权,请联系本站处理。

全部回复 0

还没有回复,来抢沙发~