标签：建站
这里收集了带「建站」标签的 22 篇文章，按发布时间从新到旧排列。
从零搭一个能长期维护的静态站：Astro 的内容与布局、Cloudflare Workers 的部署与分发、构建产物、SEO 与可访问性。踩过的坑和量出来的数字都在这组文章里。
-
27 篇文章的站内搜索：81 KB 索引与一次 304
静态站没有后端，站内搜索只能在构建期做索引、在浏览器里做匹配。这篇记录现在这套方案的实现与实测（索引 81 KB、首搜 422 ms），顺手修掉「每次搜索都重新下载索引」的问题，并说清它在多少篇文章之后会撑不住。
10月24日 23:40
-
构建产物 16 MB，访客每次只下 28 KB
统计 dist 目录发现 16 MB、313 个文件，其中 1.6 MB 的 Mermaid 图表引擎从来没被下载过。这篇把「部署体积」与「访客成本」分清：什么进了关键路径、什么按需加载、什么可以被缓存一年。
10月24日 23:20
-
可访问性体检：三个真问题与三次假警报
用脚本给自己的静态博客做了一次可访问性体检：重复 id、搜索框没有无障碍名称、键盘焦点环在深色背景上几乎看不见。同时记录体检脚本自己报过的三次假警报——它们比漏报更危险。
10月24日 23:00
-
24 篇文章的站内 SEO：一套可复跑的体检清单
不靠站长后台、不装插件，写一个脚本扫构建产物就能查出大部分站内 SEO 问题。这篇是 24 篇文章、54 个页面跑下来整理出的八项检查、九类真实问题与修法，以及三条「体检本身也会骗你」的教训。
10月24日 22:40
-
静态站的标签体系：挖出 11 个可收录页面
23 篇文章、20 个标签，但页面上一个标签都看不到——前端组件把 tags 静默忽略了。这篇记录怎么把标签变成 11 个可收录页面（10 个标签落地页 + 索引），以及中文标签在 Astro 里踩到的三个坑。
10月24日 22:20
-
和 Cookie 横幅抢 LCP：我试到哪一步就停了
上一篇发现真正的 LCP 元素是 Cookie 横幅后，我试了三种办法：提前加载、压缩体积 75%、preload 脚本。性能分从 37 提到 50、FCP 从 3.5s 到 1.5s，但 LCP 卡在 7.4s 不动。这篇记下为什么压小体积没用，以及我为什么停在这里。
10月24日 22:00
-
我的性能测试骗了我：把第三方全拦掉再测
一个多月来我的脚本一直显示 LCP 1.9 秒，直到跑了一次 Lighthouse——同一个页面 LCP 12.4 秒。差异不在工具，而在我脚本的启动参数里那行 host-resolver-rules：它把所有第三方域名都解析成了 NOTFOUND。附三个数据源的对比与修复过程。
10月24日 21:40
-
我的博客向陌生人暴露了多少信息
静态博客没有后端，但公开面比想象的大：证书透明度日志能翻出 13 个子域、DNS 里有 DKIM 与验证记录、页面里带着统计 ID 和联系方式。这篇把三层公开面逐一查清，并修掉了其中一个真正的问题（头像外链 107KB）。
10月24日 21:20
-
随机图当封面：一张 250KB，我没让它进列表
静态博客的卡片没图会很难看，随机图 API 看起来很省事。但实测那张图 250KB、Cache-Control 还是 max-age=0——如果首页 10 条卡片都挂上，一次访问就是 2.5MB。这篇算清这笔账，并给出三种封面方案的取舍。
10月24日 21:00
-
三层缓存各自为政：我的静态资源被一行 Cache-Control 拖慢
浏览器缓存、Cloudflare 边缘缓存、源站响应头三层叠在一起时，谁说了算？抓自己站的真实响应头发现：连内容哈希命名的 CSS/JS 都是 max-age=0，每次访问都要重新验证。附发现过程、Cloudflare 规则写法和免费套餐的坑。
10月24日 20:40
-
图片格式的收益边界：PNG → WebP → AVIF 实测
拿自己站上 12 张真实配图做实验：WebP 换 AVIF 在「同画质」下平均省 35%，但常见的「AVIF 省一半」是拿不同质量档比出来的。附 PSNR 对齐方法、编码耗时与什么时候才值得上 AVIF。
10月24日 20:20
-
静态博客接评论：Giscus 的配置、主题联动与三个坑
静态博客没有后端，评论只能挂第三方。这篇记录 Giscus 的完整接入：六个配置字段各自的作用、用自定义 CSS 做暗色联动的原理、不靠肉眼验证评论是否真的加载的方法，以及仓库迁移、改 slug、iframe 布局跳动三个坑。
10月24日 20:00
-
Astro 静态站的三个隐形约定：CSS 是全局的
Astro 的默认行为大多很合理，但有三条不写在报错里的约定：script 默认被打包成模块、CSS import 默认对全站生效、dist 目录从不清理。每一条我都在这两周踩过，附判断命令与修法。
10月24日 19:40
-
同一个站的两套统计，为什么差了 2.7 倍
本站装着两套统计：Umami Cloud 与自建的 Worker + D1。同一时间窗内，首页一个记 67 次、一个记 180 次。我做了个实验证明主因是广告拦截器，并列出另外三种会放大差距的机制，以及最后决定给读者看哪个数字。
10月24日 19:20
-
文章配图流水线：截图、压成 WebP、随构建分发
写技术文章一半时间花在图上。这套流水线只有四条规则：截图必须真实、按出现顺序编号、统一压成 WebP、和文章目录同名进仓库。附实测压缩数据（2073KB → 357KB）与五个踩过的坑。
10月24日 19:00
-
静态博客的隐私边界：一次第三方请求审计
静态博客没有后端，并不意味着访客只跟你的服务器打交道。用脚本审一遍页面请求：首页向 15 个第三方域发出了 30 个请求，其中一个来自模板遗留的 browser-update.org，会把访客 IP 与 UA 交给外部服务。附审计脚本与自查清单。
10月24日 18:35
-
首屏从 392KB 砍到 59KB，FCP 从 7.4 秒到 2.1 秒
用 CDP 模拟中端手机实测博客首页：GA4 与 Clarity 挤在关键路径、头像和 favicon 直接加载 107KB 原图、312KB 关键 CSS 拖慢首屏。四处改动后传输 392KB→59KB，FCP 7.4s→2.1s，长任务 13→2 个。
10月24日 17:45
-
博客 SEO 自我体检：27 个页面里揪出四个系统性毛病
不靠站长后台，直接扫构建产物做 SEO 体检：发现全站 h1 数量为 0、28 个页面都没有 og:image、静态页共用同一段描述、404 页输出了两份 head。附体检清单与修法。
10月24日 16:45
-
给静态博客的单篇文章上密码：构建期加密与浏览器解密
静态站没有服务端，密码保护只能靠真加密：构建期用 PBKDF2-HMAC-SHA256 派生密钥、AES-256-GCM 加密正文，产物里只剩盐、IV 和密文。这篇讲清参数取舍、公开仓库的明文隔离、元数据泄露清单与解密后要重跑的初始化。
10月5日 23:10
-
静态博客的站内搜索是怎么做的：一份 JSON 索引加自己写的打分
静态站没有后端，站内搜索只能在前端想办法。这篇拆开本站实现：构建期把 Markdown 压成一份 51 KB 的 search.json，浏览器整份拉下来逐字段数命中次数，再按日期排序。附实测的索引体积构成、逐字输入的重取代价与踩过的坑。
10月5日 22:50
-
给每篇文章加「更新记录」：用 git 提交历史自动生成文章修改时间线
文章页底部那块「更新记录」不是手写的：构建前用脚本读 git log 生成 JSON，页面再按 slug 查表渲染。本文拆开这条链路，讲清 fetch-depth 0 为什么是硬前提、浅克隆会怎样把一条无关提交按到所有文章头上，以及行内 diff 编辑器的取舍。
10月5日 22:35
-
静态博客怎么显示每篇文章的浏览量：从 D1 读数接口到前端排序的完整链路
静态站没有后端，文章卡片上的浏览量到底从哪来？这篇拆我自己这套链路：D1 里只有 pathname + views 两列、两个读接口的分工、前端如何一次批量取数并先藏后显避免抖动、列表页按热度排序的索引对齐，以及防刷与缓存口径的取舍。
10月5日 22:15
