静态优先:内容站的预渲染、水合与边缘 API
正文在构建时渲染成完整 HTML,交互在水合后接管,登录与评论交给同一个 Worker。记录这个博客的架构取舍,以及为水合一致性处理的那些细节。
WAYLAN / ALL
实践记录、笔记、想法、建站日志与项目,按发布时间排列。
正文在构建时渲染成完整 HTML,交互在水合后接管,登录与评论交给同一个 Worker。记录这个博客的架构取舍,以及为水合一致性处理的那些细节。
不需要 Canvas,也不需要额外的图片。把虚线的线段长度设为接近零,再配合圆形端点,一条 SVG 路径就会变成一串均匀的圆点。
深色模式之所以难维护,往往是因为颜色直接写在了组件里。把 token 分成原始值、语义与组件三层,主题切换就只是换一组映射。
你正在浏览的这个网站。静态预渲染的 React 应用,部署在 Cloudflare Workers 上,支持私人划线、段落级批注,以及基于 GitHub Discussions 的公开讨论。
这周把批注的定位从“只认字符偏移”改成了“块标识 + 原文 + 前后文”的三段式查找,并补上了原文已变化时的展示。
静态站点只需要很少的服务端能力:登录、评论和批注。用一个 Worker 同时托管静态资源与 API,再配一个 D1 数据库,就能覆盖这些需求。
一条批注指向的是“某几个字”,而文章会被修改。精读 W3C Web Annotation 的选择器设计,并记录我在实现中采用的定位顺序与失败策略。