perf(home): 首屏 eager+关键 CSS 内联,Lighthouse 伪影根因修毕
- 车道 D 三件收编(op-gitea):①index.astro 首两图 eager+首图
fetchpriority=high(Image 默认 lazy 曾压 LCP 至 6.4s,好模式现
1.3s)②inline-home-css.mjs:BaseLayout 11KB 内联首页 head(省
发现+下载跳)③build.sh 守卫挂钩
- 诊断结论入档:home 中位漂移根因=测试床伪影(python server 不压
缩,裸传 67KB vs 生产 gzip 9.2KB;lantern 对未压缩 HTML 流式归因
双峰 99↔165ms 翻转出两个世界)——gzip 等价口径中位 100
(FCP 0.9-1.1s/LCP 1.3-1.4s/TBT 0/CLS 0)
- 测试床转正:gz-server.py 泛化入仓(ThreadingHTTPServer+gzip
[端口 目录] 参数化)——兼治 SW 预缓存风暴竞速(单线程 server
曾把 E2E /gallery/ networkidle 饿死,实锤于收编验收)
- E2E serviceWorkers:'block':SW 有专属测试,站点 E2E 求确定性
- 三连否定留档:SW✗/css链✗/子集内联 v3✗(6×63 反例钉死,已
回滚)——残尾 20% 离群属 lantern trace 抖动,采中位+多轮
车道:op-gitea(过程三连否定+测试床移交);收编验收:内联 10KB
实出+首图 eager 实证+E2E 31/31(SW 屏蔽后确定性复现)
验证: gz 测试床 18743 gzip 10KB(生产等价口径);node tests/e2e.mjs
31/31 PASS;构建+守卫链复跑
Spec: none (性能三件+测试床转正,车道级交付)
Co-authored-by: GLM-5.3
This commit is contained in:
1 parent
71b8985c17
commit
0b6524f53c
5 files changed
+62
-2
No files matched your search
@@ -73,13 +73,16 @@ const photos = (await getCollection('photos')).slice(0, 4);
|
||||
<a class="tap more" href="/gallery/">进入图库 →</a>
|
||||
</div>
|
||||
<div class="thumbs">
|
||||
{photos.map((photo) => (
|
||||
{photos.map((photo, i) => (
|
||||
<a class="thumb" href="/gallery/" aria-label={`查看图库:${photo.data.title}`}>
|
||||
{/* 首两图 eager(Astro Image 默认 lazy 会把 LCP 压到 6s+),首图再拔 fetchpriority */}
|
||||
<Image
|
||||
src={photo.data.image}
|
||||
alt={photo.data.alt ?? photo.data.title}
|
||||
widths={[180, 360]}
|
||||
sizes="(min-width: 820px) 20vw, 42vw"
|
||||
loading={i < 2 ? 'eager' : 'lazy'}
|
||||
fetchpriority={i === 0 ? 'high' : undefined}
|
||||
/>
|
||||
</a>
|
||||
))}
|
||||
|
||||
Reference in new issue
Block a user