← 回到首页
DEVELOPMENT LOG

開発ログ

从一张静态导航页，到有管理台、互动留言板、角色介绍页的小站。这里是这段时间做过的事，按时间从旧到新。

13个版本
20个页面
1.7API 版本
30+次部署
v0.12026.10.25

起点：把整个站看清楚

  • 把容器、站点目录、反代关系摸了一遍：OpenResty 跑在 host 网络容器里，宿主机 /opt/1panel/www 挂进容器 /www。
  • 确认后端其实只有三块：静态站、usagi-api（纯标准库 HTTP 服务）、手工起的上传服务。
  • 写出第一版《站点架构说明》，把拓扑、端口、接口和风险列清楚。
  • 当时的判断：不引框架、不换数据库。2 核 2G 的机器，SQLite 完全够用，MySQL 光常驻就要 300–400 MB。
v0.22026.10.26

把「能跑」变成「出事能恢复」

  • 上传服务从 SSH 手工进程改成 systemd：原先父进程是 sshd，一断线就没了；改完 enabled + Restart=always，崩了 3 秒拉起。
  • 顺手把它从 0.0.0.0 收回 127.0.0.1（OpenResty 是 host 网络，反代照样通），token 从代码里挪进 /etc/usagi-upload.env。
  • 每日 03:30 备份：用 sqlite3 .backup 而不是 cp——cp 在写入时可能拿到半个事务，.backup 是在线一致性备份。
  • 访问统计：解析 nginx 日志，用「页面 + 静态资源」双条件认人，配 UA 黑名单。不用第三方统计，是不想给页面塞外部脚本。
v0.32026.10.26

管理台：终于看得见访客了

  • /admin.html 加一组 /api/admin/* 接口，口令复用原来的 USAGI_ADMIN_TOKEN，不另建账号体系。
  • 三个面板：访问记录（IP / 地区 / 路径 / 状态 / 客户端）、留言管理、14 天趋势。
  • 地区解析为什么用 ip-api 而不是离线库：离线库（ip2region，约 11 MB）从这台机器下载不到，GitHub、jsdelivr、gitee 全不通；代价是访客 IP 会发给第三方。
  • 性能是后来才修好的：接口现场只查 1 个新 IP，其余交给后台每 10 分钟补 45 个进 SQLite 缓存，响应从 10.5 秒降到 0.93 秒。
  • 同一天还做了口令轮换、软删除 + 回收站、SQLite 切 WAL 并加索引。
v0.42026.10.26

留言板：反垃圾、体验、互动

  • 反垃圾五道闸：隐藏蜜罐字段、提交耗时不足 2.5 秒判机器人、链接超过 2 条拒收、同 IP 同内容 10 分钟去重、单 IP 60 秒 + 全站每分钟 5 条限流。
  • 体验：游标分页（before=id）替代整页重拉，发送后局部插入并高亮 2 秒，昵称记在 localStorage，Ctrl+Enter 提交。
  • 互动：点赞（reactions 表，一人一票）、楼中楼（只做一层，回复的回复归到同一顶层）、置顶、管理台直接回复。
  • 为什么不用 WebSocket：这个量级不值当，局部刷新已经够快，还省掉长连接和重连逻辑。
v0.52026.10.26

把「说不清」的地方补上

  • 回复对象 reply_to：列表一扁平就丢了「在回谁」，补一列记住对方昵称。
  • 举报按钮 + 管理台「只看被举报」、关键字搜索、分页；这三样是管理台从「能看」到「能用」的分界。
  • 今日计数「N 条 · 今天 +M」和空状态文案，让人知道这里还活着。
  • 图片：复用上传接口，默认 pending，管理台审核通过才显示。公开站不想让任意图片直接上墙。
v0.62026.10.27

首页重做：酷洛米

  • 从「淡粉柔光」换成黑紫玫红：黑底、骷髅徽章、跑马灯、棋盘格，把「凶但软」的气质做出来。
  • 素材取自 Sanrio 官方角色页，转 WebP 后一共 574 KB，配 srcset 让手机只下 480w。
  • 结构：双栏 hero、角色档案条、今日一句、公告、6 张分区卡片、About 官方横幅、Q&A 轮播、8 张画廊。
  • 动效：星空 canvas、漂浮头像、极光、卡片光斑、滚动揭示，全部受 prefers-reduced-motion 约束。
  • 为什么还是全手写：整页就一万多行 HTML/CSS，引框架等于多一层构建、多一份体积，换不来什么。
v0.72026.10.27

绫华页 + 两个入口

  • /ayaka.html：官方立绘、资料、三副面孔、太刀术、命座、配队、配装、养成、台词。
  • 首页页脚爱心连点三次进 /admin.html，作为不显眼的管理入口；它被别人的编辑覆盖过一次，之后加了 build 标记，方便一眼看出是不是自己那份。
  • 「今日一句」升级成 32 条台词库：按日期取默认值，点击 / Enter / ←→ 切换，每条都标作品和角色。
v0.82026.10.28

往下滚，东西自己长出来

  • 顶部进度条、SCROLL 提示、分区标题横线生长、卡片与画廊逐个入场、骷髅条弹入、回顶按钮。
  • 视差分三层：立绘 0.10、文案 0.045、底纹 0.055；scroll 用 passive + rAF 节流，不抢主线程。
  • 卡片 3D 倾斜只在 pointer:fine 下启用，触屏不参与。
  • 踩过的坑：fixed 元素放进带 transform 的父级，会以父级为包含块——SCROLL 提示因此跑到画面中间。
v0.92026.10.28

点一下，会掉星星

  • 点击任意位置撒骷髅、爱心、星星粒子：55 ms 节流，总量上限 26 个，动画结束回收节点。
  • 图片优化：立绘 PNG 51 KB 换成 WebP 20.8 KB，画廊补 480w 版本，首屏加 preload。
  • 可访问性：提高浅色主题对比度、加 focus-visible 描边、Q&A 圆点扩到 36px 热区、减少动效时不自动轮播。
  • 运维：每 5 分钟监控、日志轮转、Windows 侧异地拉取并校验、服务器上的恢复演练。
v0.102026.11.01

把毛边收一收

  • 补上真正的 404：nginx 里加了 error_page 404 /404.html;，不存在的路径不再空白，而是那张带骷髅徽章的酷洛米 404。
  • 跨文档过渡：首页、绫华页、留言板、开发日志都加了 @view-transition，站内跳转缩放淡入，不再白闪。
  • 新增 About 页：/about.html 从开发日志改造而来，首页第六张卡片从「準備中」变成可点。
  • 标题换成 Zen Maru Gothic 圆体，只取用到的字符，woff2 一共 7.9 KB。
  • 第三套主题「夜樱」：黑底加樱色渐变，主题按钮变成 ☾ / ☀ / ❀ 三态。
  • 灯箱重做：八张缩略图、← → 翻页、Esc 关闭、焦点锁在弹窗里。
  • 订阅：/feed.xml 上线，留言与公告每小时汇总，可以直接丢进 RSS 阅读器。
v0.112026.11.02

排行榜、问答箱，和冬天的第一版

  • 排行榜上线：scores 表 + GET/POST /api/scores，2048 与凛鲸娘幸存者结算时自动提交，/rank.html 两个榜，首页多一张卡。
  • 匿名提问箱：questions 表、/ask.html、管理台新增「问问站长」标签页（待答 / 已答、就地作答、删除）。一套口令两个入口，没另开登录。
  • 首页「问问站长」卡不再写死示例，改成实时读 /api/ask 的最新一条。
  • 冬天成为默认主题：11–2 月 winter、3–4 月 sakura、其余 dark；<head> 里加早期脚本，首屏不会先闪一下深色。
  • 补回「弹幕幻想」：重做首页时入口卡丢了，游戏本体一直在 /danmaku/，这次连宣传图一起放回导航。
  • sitemap.xml 重写：去掉已 404 的 /now.html，补上 rank / game / 2048 / stats / ask / danmaku。
v0.122026.11.03

轻一点，也快一点

  • 冬日皮肤铺满全站：留言板、访问统计、问问站长、排行榜、关于、绫华页都接上同一套雪色变量；绫华页 hero 里硬编码的白底换成深蓝卡片。
  • 手机端减负：进站不再把 5 首歌全预取成 blob（手机端那是 18 MB），播放器默认折叠、毛玻璃与噪点关闭、星空的 dpr 和粒子数一起降。
  • 音乐换格式：mp3 → m4a（AAC 192k / 80k），单曲 9.5 MB 降到 5.4 MB，整站 77 MB → 54 MB，Range 请求与 30 天缓存照旧。
  • 起播引子：每首歌切一段 12 秒、约 100 KB 的短文件先出声，12 秒后从同一位置交叉淡入正片——第一声不再等 5 MB 下完。
  • 扫描器不再刷日志：nginx 对 dotfile 与 php 探测直接 return 444（不回话断连），/.env、/.git/config 实测拿不到响应。
  • 首页拆分：18 段 <style>、16 段 <script> 合并成 /site.css 与 /site.js，index.html 从 156 KB 降到 25 KB，gzip 后 48 KB → 8 KB。
  • 六个小功能：站龄、连续来访天数、深夜模式（0–5 点降亮 + 标题换成「这个点还在」）、卡片鼠标倾斜、空白处单颗星星（停 5 秒、上限 30）、库洛米光标（悬停在可点元素上仍是手掌）。
  • 修 bug：引子播放期间点暂停要点两次——按钮判断的是正片的 paused，和真正发声的元素不同步；空格键、锁屏控制的暂停也一并收到同一个 togglePlay()。
v0.132026.11.09

有自己的域名了

  • 备案通过：沪ICP备2026059621号-1，域名 chypy.com，页脚挂上备案号并链接工信部。
  • HTTPS 上线：Let's Encrypt 证书到 2027-02-07，HTTP/2、TLS 1.3、HSTS；http 与裸 IP 统一 301 到 https://chypy.com。
  • 证书自动续期：certbot.timer + 续期钩子自动拷证书并 reload OpenResty。
  • 全站换域名：sitemap、三份 RSS、og:image、og:url、canonical 全部改成 https://chypy.com。
  • 会话 Cookie 加 Secure。
  • 顺手修：重复的两条 Cache-Control 合成一条；HANDOFF.md 移出网站根目录。
  • 修 bug：卡片「点了没反应」——关闭 iframe 软导航，跳转交回浏览器原生（代价：跳页时音乐停）。
next在做 / 在等

接下来

  • 在等：公安联网备案。ICP 通过后 30 天内要办，办完把公安备案号也加到页脚。
  • 在做：brotli（现在只有 gzip）、CSP 从 Report-Only 转正式。
  • 待定：game.html 318 KB 拆成外链；/secret.html 要不要加访问密码；留言审核队列。
  • 在等数据：访客地图。geo 表只有国/省/市，没有经纬度，要么换离线地理库，要么先做「按地区聚合的横条」。
  • 技术债：/qianmen/ 那套 Vue 仍占 50 MB，可以换原生重写。