KakapoWP KakapoWP
登录 免费试用
Kakapo Performance

关键 CSS

首屏所需的内容放在 head 里。其余部分随后加载。

卡卡波会为每个模板取回网站上一个真实的示例页面,从磁盘读取该页链接的本地样式表,并逐条规则与文档比对。首屏需要的部分内联进 head;被分析过的样式表随后加载,不阻塞页面构建。整个过程不涉及浏览器:“首屏可见”是基于元素顺序的公开近似判断,拿不准时就把规则一并保留。因此提供预览、测试运行和按模板的开关。

关键 CSS

7 个模板 · 每个模板各有自己的运行、开关与预览

测试模式预览

关键 CSS 提供这些

7 个模板,逐个分析并单独启用
关键 CSS 内联在 head 中,已分析的样式表延迟加载
报告:未命中任何元素的规则
同一页面处理前后的预览对比
测试模式:只有已登录的管理员能看到改动
URL 排除列表,样式表例外列表

工作原理如下

1

分析模板 — 抓取示例页面,检查规则

2

对比处理前后的预览效果

3

先放行模板,再从测试模式切到正式生效

关键 CSS 常见问题

测量的是首屏真正可见的内容吗?
不会。这里既没有浏览器,也没有视口。body 以下的所有元素会被逐一编号;“首屏”指前 30 %(可在 5 到 90 之间调整),再加上已登记的地标区域内的一切——页头、导航、第一个 h1,以及你自行补充的部分。凡是该方法触及边界之处,规则一律算作命中:多出几千字节,总比缺一条规则无害。
可以从这里直接删除未使用的规则吗?
这份列表是报告,不是工具。计数是针对每个模板的一个示例页面进行的——由 JavaScript 在点击后才添加的类,或位于另一页面上的表单,都不会出现在其中。删除最好在主题源码里进行,那里更容易追溯。
分析运行需要什么?之后又会发生什么?
需要 PHP 扩展 dom/libxml,以及可用的回环——网站必须能通过 HTTP 访问到自己。缺少其中之一,分析根本无法启动;原因就写在当场。若之后某个已分析的 CSS 文件或主题发生变化,处理会自动暂停,而不是输出可能已经失准的关键 CSS。

更多性能功能

准备好了吗?

免费试用 Performance 24 小时。

无需信用卡,零风险。2分钟即可开始使用。

立即免费试用