在安装完 Ghost 之后,针对中国大陆地区的访问,是有两个可以优化地方:

  • config.production.json
  • ghost_head.js

这两个文件内都有引用一些外部的资源来实现一些功能,不过默认情况下,这些外部资源的可能会导致页面加载缓慢,所以应该稍微给他们做做调整。


config.production.json

这个文件是 Ghost 的配置文件,记录了 Ghost 的一些诸如:端口、邮件、数据库、外部引用资源等等基本信息。文件正常来说就在 Ghost 的根目录下,使用文本编辑器打开之后,可以看到里面有一些外部资源引用的描述。

目前 ghost 默认是使用 cdn.jsdelivr.net 的 CDN 来引用这些外部文件,在 2022 年底之前,这个 CDN 在大陆的响应速度是相当优秀的,不过目前已经是几乎接近不可用的状态了,所以我们先把这些外部引用的链接改到大陆访问正常的 CDN 上。

替换 cdn.jsdelivr.net 到镜像服务 /自行托管:

目前在中国大陆访问 cdn.jsdelivr.net 的状态不稳定,不同地区不同运营商不同时间访问,都可能得到不同结果,即便用户能正常访问,速度也是慢到不行。所以我们需要把它换到可以稳定访问的镜像服务,或者直接自己托管。

镜像服务目前推荐两个:

  1. fastly.jsdelivr.net ,第一方的镜像分发,大陆访问会解析到一个日本服务器,速度中规中矩,优点是比较稳定,可用性高,缺点是在中国大陆访问的时候速度相对来说比较普普通通;
  2. cdn.jsdmirror.cn ,这个算第三方镜像了,中国大陆访问会解析到内地服务器,全球访问则是 Cloudflare 节点做分发,优点是全球访问(含中国)速度都很快,缺点是稳定性不可知。

挑一个合适自己的,然后打开 config.production.json,把里面 portal / sodo- search / comment 里面的 cdn.jsdelivr.net 直接替换成镜像站域名即可。

通过主题文件目录托管:

主题文件托管算是最简单的自托管方式,无需修改代理服务器,只需要将文件存储到主题文件的 assets 下面,直接引用就可以,比如:

# 进入主题文件目录的 assets(比如自带主题 casper)
cd themes/casper/assets
# 创建一个文件夹区区分自托管的文件
mkdir ghost && cd ghost

# 下载需要托管的文件
wget https://fastly.jsdelivr.net/ghost/portal@latest/umd/portal.min.js
wget https://fastly.jsdelivr.net/ghost/sodo-search@latest/umd/sodo-search.min.js
wget -o sudo-search.css https://cdn.jsdelivr.net/ghost/sodo-search@latest/umd/main.css
wget https://fastly.jsdelivr.net/ghost/comments-ui@latest/umd/comments-ui.min.js
wget -o comments-ui.css https://fastly.jsdelivr.net/ghost/comments-ui@latest/umd/main.css

回到 config.production.json 编辑引用路径,比如:

portal: {
  url: https://your-domain/assets/ghost/portal.min.js
},
sodoSearch: {
  url: https://your-domain/assets/ghost/sodo-search.min.js,
  styles: https://your-domain/assets/ghost/sodo-search.css
},
comments: {
  url: https://your-domain/assets/ghost/comments-ui.min.js,
  styles: https://your-domain/assets/ghost/comments-ui.css
}

Gravatar 服务替换成镜像服务:

除了上面几样,另外还有一个 Gravatar 可以修改,主要用在 Ghost Portal 这类需要展示头像的模块上。Gravatar 在中国大陆的使用频率很低,没有什么人给自己设置 Gravatar 头像,且默认的 Gravatar 官方(Wordpress)服务在中国大陆基本被屏蔽,所以很多人会干脆放弃使用或者使用镜像服务器。

目前我使用过稳定提供服务时间比较长的镜像是 gravatar.loli.net ,这个镜像服务在中国大陆访问速度不快,属于可用级别。考虑到使用率不高,所以我的要求也不高,能比较稳定就足够了。

修改方式也是在 config.production.json 里面,把默认调用的官方 Gravatar 地址替换掉,改成 gravatar.loli.net 就好了,比如:

gravatar: {
  url: https://gravatar.loli.net/avatar/{hash}?s={size}&r={rating}&d={_default}
}

ghost_head.js(没有启用付费会员功能可以忽略)

Ghost CMS 提供了不同等级订阅用户的设置。如果开启非付费的普通会员功能,不会有任何额外资源加载,但是如果开启订阅用户会员的功能,那么在前台页面加载的时候,会自动载入 Stripe 的脚本,它的作用是校验订阅用户的付款信息。

因为个人需要开启了付费会员,但我没有开通 Stripe 收款账户,所以只是用测试模式来开启的付费会员。测试模式实际并不需要加载 Stripe 脚本来校验用户实际付款信息,所以我这边选择禁用 Stripe 资源的加载,避免拖累用户访问速度。

要禁用 Stripe 资源加载需要禁用/删除对应代码,它的位置就在 ghost_head.js 文件里。这个文件的目录是 current/core/frontend/helpers ,进入目录后,使用文件编辑器打开它,搜索关键词 js.stripe.com ,然后直接整行注释或者删除:

if (
    settingsCache.get('paid_members_enabled')) {
    /* 下面这段注销掉或者直接删掉也行 */
    /* membersHelper += `<script async src="https://js.stripe.com/v3/${isFraudSignalsEnabled}"></script>`; */
}

这两项修改完之后,记得重启 Ghost 服务。再之后尝试清理缓存重新访问一下自己的站点,正常来说整页的加载速度应该会提升不少,虽然达不到质的飞跃,但是对于大部分初次访问的用户来说,体验感应该会好上不少。

除了上面这几项之外,要进一步提升站点访问的速度,建议在代理服务器(比如 Nginx)合理配置服务器缓存相关的设置,如果需要一点一点 Spark,可以参考我另外几篇内容:

Ghost CMS 配置缓存提速
虽然 Ghost 在不做任何优化的情况下,响应速度就已经优于 Wordpress 很多了。但是,如果可以让它的体验再好一点,为什么不呢?