Speed Brain 是一种通过预取最可能的下一次导航来改善网页性能的工具。
| Free | Pro | Business | Enterprise | |
|---|---|---|---|---|
Availability | Enabled by default | Yes | Yes | Yes |
Speed Brain 在以下条件下工作:
- Cloudflare 中已启用 Speed Brain 功能。
- 网页访问者的浏览器使用 Chromium 内核浏览器版本 121 或更高版本。
- 预取所请求的网页符合缓存条件。
- 预取所请求的页面不会调用 Worker。
Speed Brain 的总体目标是在用户导航到某个网页之前,尝试将该网页下载到浏览器。
Cloudflare 利用 Speculation Rules API ↗ 指示浏览器考虑预取未来导航,从而改善网页性能。Speed Brain 不会改善网站上首次访问页面的加载时间,但可以改善同一站点上后续导航页面的加载时间。
通过预取浏览器认为用户可能导航到的页面,Speed Brain 可以增强 Largest Content Paint ↗ (LCP)、Time to First Byte ↗ (TTFB) 和整体页面加载时间等关键指标。
启用 Cloudflare 的 Speed Brain 功能后,网页响应会添加名为 Speculation-Rules 的 HTTP 标头。该标头的值是一个 URL,托管一套有明确倾向的 Speculation-Rules 配置。此配置指示浏览器以 conservative eagerness ↗ 考虑预取任何未来导航。
配置如下所示:
{
"prefetch": [
{
"source": "document",
"where": {
"and": [{ "href_matches": "/*", "relative_to": "document" }]
},
"eagerness": "conservative"
}
]
}此配置指示浏览器为未来导航发起预取请求。这些预取请求会包含 sec-purpose: prefetch HTTP 请求标头。未成功的预取将以 503 状态码响应。成功的预取将以 200 状态码响应。
要测试是否已启用 Speed Brain,可以检查网页的 HTTP 响应标头是否包含 Speculation-Rules 标头。但请注意,在 Speed Brain 的 beta 阶段,此行为可能并非 100% 一致。
要测试浏览器是否在发起预取请求,请在 Chrome DevTools 中打开 Network(网络) 选项卡。然后,在已启用 Speed Brain 的网页上对某个链接执行 mouse-down。此操作应会发起预取请求,并在 Network(网络) 选项卡中可见。但请注意,浏览器可能因多种原因选择不发起预取。更多详情请参阅 Chrome Limits 指南 ↗。有关调试 Speculation-Rules 的更多一般信息,请参阅 Chrome Speculation Debugging 指南 ↗。
Speed Brain 设计为与 Web Analytics 和 Real User Measurements (RUM) 集成。此集成使你能在 Cloudflare 仪表板的 Web Analytics 界面中了解 Speed Brain 对网页性能的影响。
虽然你可以在未启用 RUM 的情况下使用 Speed Brain,但你将无法了解该功能如何影响网页性能。有关如何设置 RUM 的更多详情,请参阅 Web Analytics & RUM 文档。
Speed Brain 可在仪表板的 Cloudflare Speed(速度) 选项卡中使用,也可通过 API 使用。
要在仪表板中启用或禁用 Speed Brain:
-
在 Cloudflare 仪表板中,前往 Speed(速度) > Settings(设置) 页面。
Go to Settings ↗ -
前往 Content Optimization(内容优化)。
-
将 Speed Brain 切换为 On 或 Off。
使用以下 PATCH 请求启用 Speed Brain:
Required API token permissions
At least one of the following token permissions is required:Zone Settings Write
curl "https://api.cloudflare.com/client/v4/zones/$ZONE_ID/settings/speed_brain" \
--request PATCH \
--header "Authorization: Bearer $CLOUDFLARE_API_TOKEN" \
--json '{
"value": "on"
}'要禁用 Speed Brain,将 value: 设为 "off"。
你也可以使用 Terraform 配置 Speed Brain。更多详情请参阅 Terraform 文档 ↗ 中的 cloudflare_zone_settings_override 资源。
-
由于预取响应不保证会被浏览器渲染,Speed Brain 包含两项防护措施,以尽量降低 unsafe prefetching ↗ 的风险:
-
Speed Brain 不会在运行 Workers 的路由上预取。若没有此防护,预取请求可能无意中运行假设传入请求为正常请求(即非预取)的 Worker 逻辑。一个例子是在 Worker 中运行的页面浏览计数器递增。若页面实际上未在浏览器中渲染,页面浏览计数器不应递增。
-
预取请求永远不会到达源站服务器。预取请求仅提供存储在 Cloudflare 缓存中的内容。若内容不在缓存中,预取请求不会继续前往源站服务器。若没有此防护,即使预取响应未在浏览器中渲染,源站服务器状态也可能被修改。一个例子是对登出 URL 的预取
GET请求无意中触发服务器上的登出操作。
-
-
若源站服务器响应包含
Speculation-Rules标头,则不会被覆盖。 -
Speed Brain 不适用于使用
strict-dynamic或nonce-{hash}属性的限制性 Content Security Policy ↗ 配置。 -
目前,Speed Brain 与使用或依赖
pages.dev的网站不兼容。