图片位 · 待补
把图放到 /about/portrait.webp 就会自动出现
这是一个什么样的站
它原本只是一张导航页:几个入口卡片,点进去是乌萨奇、小游戏、留言板。后来慢慢长出了角色介绍页、访问统计、管理台,甚至一个能点赞、能楼中楼回复的留言板。技术上没什么高深的东西——一台 2 核 2G 的云服务器,1Panel 管着 OpenResty,后端是一个纯标准库的 Python 服务,数据放在一个 SQLite 文件里。
做成酷洛米的样子,是因为喜欢那种「看起来凶,其实很软」的气质。黑色、玫红、骷髅、蝴蝶结,加上跑马灯和棋盘格——这些元素凑在一起,就是现在这个页面。
下面这些版本记录,是按时间从旧到新的。每一条都对应一次真实的改动,不是占位文案。
- 主机 腾讯云 2 核 2G · Ubuntu 22.04 · 39 GB 盘
- 栈 OpenResty(1Panel 容器) + Python 标准库 HTTP 服务 + SQLite(WAL)
- 页面 全静态手写,无框架、无构建、无第三方请求
- 部署 一个带 token 的上传接口,改完直接 PUT
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 首(手机端 18 MB)、播放器默认折叠、关毛玻璃与噪点、降低星空负载。
- 音乐 mp3 → m4a(AAC),单曲 9.5 → 5.4 MB,整站 77 → 54 MB。
- 起播引子:12 秒 / 约 100 KB 先出声,再从同一位置交叉淡入正片。
- nginx 对 dotfile 与 php 探测返回
444,扫描器不再刷日志。
- 首页拆分:
/site.css + /site.js,index.html 156 KB → 25 KB,gzip 48 KB → 8 KB。
- 六个小功能:站龄、连续来访、深夜模式、卡片倾斜、空白星星、库洛米光标。
- 修 bug:引子播放期间暂停要点两次。
next在做 / 在等
接下来
- 在做:HTTPS。chypy.com 还在 ICP 备案,过了就用 Let's Encrypt 上证书,加强制跳转、HSTS、HTTP/2——这一条解锁后,CSP 和缓存策略也一起做。
- 在等数据:访客地图。geo 表现在只有国/省/市,没有经纬度,要么换离线地理库,要么先做「按地区聚合的横条」。
- 待定:留言审核队列(新 IP 前 3 条人工过)、回收站彻底删除与自动清理、游戏排行榜。
- 观望:告警通道(要 webhook 或邮箱)、云端异地备份(要 COS 或 rclone 目标)。
- 技术债:usagi.html 还挂着 83 KB 的 Vue 打包产物,可以换原生重写;管理台登录缺限速;CSP 还没上。