yingqing/docs/todo/还原性能落地-进度.md

还原 + 性能落地 · 进度

/loop 自主推进。每波结束本地存档(不 push)。计划:~/.claude/plans/gleaming-sleeping-ullman.md。 两份审计 checklist:UI还原对比报告-AirShelf-2026-06-19.md、性能审计报告-AirShelf-2026-06-19.md。

---

Wave 0 · 性能根因 — ✅ 完成 (2026-06-19)

#	项	状态	改动 / 证据
1	MySQL 连接复用	✅	settings/base.py 加 CONN_MAX_AGE=300+CONN_HEALTH_CHECKS=True+connect_timeout=5(mysql 分支),development.py 去重。production 经 from .base import * 自动继承。实测注入:ENGINE=mysql / CONN_MAX_AGE=300 / HEALTH=True / OPTIONS.connect_timeout=5。收益最大、最低风险。
2	视频轮询不再整页重渲染	✅	App.tsx pollVideosQuiet 收尾 setProjectDetail 改 JSON 脏检查 —— 在途段未变化(多数 5s 轮次)时返回 prev 跳过 setState,整棵管线不再每 5 秒空重渲染。纯前端,不碰生成/脚本业务。
3	图片懒加载	✅	ai-tools.tsx 任务历史网格+列表两处 <img> 补 loading="lazy" decoding="async"。
4	隐藏标签页暂停轮询	✅(保守)	pipeline.tsx 审核(8s)+ 基础资产在途(4s)两个纯读轮询 tick 起始加 if (document.hidden) return(回前台自然恢复)。

Wave 0 有意偏离计划(已记录,非偷懒)

• 视频 5s 轮询的 hidden-guard:跳过。 该轮询在本机无 Celery 时驱动视频生成推进(前端 poll-video-segment),加 hidden-guard 会让切走标签时生成暂停 —— 触碰「轮询业务逻辑」(loop 规则 3 禁区)且改变行为。Task 2 的脏检查已消除它真正的性能问题(每 5s 整页重渲染),故 hidden-guard 非必要,保守不加。
• pending-assets「空闲 N 轮后停」:跳过。 其重启触发不在 effect 依赖里,停了之后用户在该趴新触发的生成将拿不到 loading 占位卡(回归风险)。只加 hidden-guard 已解决「后台标签空跑」的性能点。
• products/projects 服务端分页:挪到 Wave 1 S7。 服务端分页必须配可用的分页器(翻页 UI)才不会把「第 21 条以后」彻底锁死;裸上服务端分页而无分页器 = 页面更坏。S7 正是建富分页器,两者合并做才连贯。per-product / ai-tools 的 pageSize:200 是有界上限,叠加本波 lazy-img 已可接受,届时一并接服务端分页。

Wave 0 验证

• npx tsc --noEmit → exit 0
• python manage.py check → 0 issues;DB 设置实测确认 CONN_MAX_AGE 生效
• 无头浏览器(playwright/chromium,注入 airshelf_token)走查 14 条 authed 路由全部 boot,0 console/page error(证 App.tsx/pipeline.tsx/ai-tools.tsx 改动无运行时回归)
• 登录探针:用户名字段在、无邮箱字段、点击→/dashboard 726ms(真·API+水合,无人为延迟)
• 截图存档:_qa_shots/wave0/*.png(14 路由 + after-login)
• 注:Wave 0 改动均为非视觉(设置/轮询/懒加载),pixelmatch 预期 ~0 delta,逐页像素对比留到对应视觉波次(Wave 1/3)做。

---

Wave 1 · 系统性 CSS/组件 (S1-S9) — ⏳ 进行中

为护住共享 CSS,拆两段做:part 1 = 浮层/反馈(S3/S4/S9),part 2 = token/布局(S1/S2/S6/S7/S8)。

part 1 — ✅ 完成 (2026-06-19)

#	项	状态	改动 / 证据
S4	弹窗进场动画 + ESC	✅	overlays.tsx 新增共享 useOverlayTransition(open, close):挂载→下一帧上 .show(触发 .modal scale(.96→1) / .drawer translateX CSS 过渡)→关闭先撤 .show 播退场再卸载;统一接管 ESC。应用到 TeamModal/ConfirmModal/SuccessModal/Drawer。EmptyPanel 补 .ic-empty 灰 icon(Inbox)。
S3	Toast 体系归正	✅	ToastLike(app-shell)改渲染设计系统 .toast(右下、单橙 .ic-t、--shadow-floating、挂载滑入),不再随 success/error 变绿/红边(单一 accent 铁律);icon 按类型 Check/AlertCircle/Info,盒仍橙。auth-screen 旧 .login-toast → .toast。旧 inline-toast/login-toast 渲染处全部切走(CSS 残留留到 part 2 的 styles.css 治理一并清)。
S9	表格横线	✅	account-page.css 删 .billing-table tbody td { border-bottom } + last-child 规则。逐页对照 V1 account.html 确认:V1 该表 td border-bottom:0、只有 thead 分隔 + 行 hover 底色,React 原先多画的行线是偏离,删后对齐 V1。

part 1 验证: tsc --noEmit 0;交互走查(playwright)auth-toast:.toast.show 出现、文案对、旧 .login-toast 计数 0;team-modal:#open-invite 打开 .modal-bg.show(scale 落定=进场动画跑过)、ESC 成功关闭并卸载;14 路由回归 boot 全过 0 报错、登录 643ms。截图:_qa_shots/wave1/*.png。

part 2 — ✅ 完成 (2026-06-19)

#	项	状态	改动 / 证据
S1	双主题清污染	✅	确认是真视觉泄漏:styles.css :root 定义 --orange #E55B26(暖橙)、--ink-3 #9C988C,design-restraint.css 不再声明这些名 → 用 var(--orange) 的孤儿类渲染成错误的橙。把 Dashboard 区(.recent-row/.shortcut/.tip 等,dashboard.tsx 实际在用)从 styles.css 迁入 design-restraint.css,暖米 token → restraint(--orange→--heat、--orange-tint→--heat-12、--ink→--accent-black、--ink-3→--black-alpha-48、JetBrains→--font-mono);并修 design-restraint.css 自身 .queue-chip svg 的 --ink-3→--black-alpha-56。实测:.shortcut .ic color=rgb(250,93,25)(=--heat)、bg=rgba(250,93,25,.12)、.tip color=rgba(38,38,38,.64) —— 暖橙泄漏已除。
S2	mono 字号分级	✅(基建)	design-restraint.css 加 .mono-10/.mono-11/.mono-12(10.5/11/11.5px)工具类。逐页应用并入 Wave 4 P2 扫(计划本就如此)。
S6	批量栏共享	⏭️ 挪 Wave 3	products 的 .bulk-bar/.card-check 蓝本已在;其价值是接线到 projects/library = 逐页活,放 Wave 3 重建这俩页时连 CSS 提共享 + 接线一起做才连贯(现在只挪 CSS 无消费者=空动作)。
S7	富分页器	✅(组件)	pager.tsx 加可选 props:onPageSizeChange(每页条数点击循环 12/24/48/96)+ 跳页输入(>7 页显示)+ sticky 吸底;旧调用方不传则退化为原只读分页器(零破坏)。CSS 加 .size-cycle/.jump/.sticky。接线到 products/library + 服务端分页放 Wave 3(Wave 0 暂缓项一并)。
S8	hero 字重	✅(改 700,证据翻案)	核 V1 实测:account.html .balance-hero .v/.balance-sub .v/.recharge-card .amt 与 team.html banner 数字都是 font-weight:700。V1 设计稿是用户拍板的「视觉标准答案」,虽与 design.md §2.5「700 仅 Ctrl-K」冲突,但用户明确要还原 V1→ 据实改 700(account 3 处 + team 2 处)。实测 .balance-hero .v=700、.banner-id .nm=700。⚠️ 记录此 design.md §2.5 与 V1 设计稿的内部不一致。

part 2 验证: tsc --noEmit 0 + npm run build 0;computed-style 实测(橙=rgb(250,93,25)、hero 字重=700);pixelmatch(修正 Windows file URL 后)account 1.23% / team 2.13%(低,字体/真实数据残差,达标);14 路由回归 boot 全过、登录 639ms。截图 _qa_shots/wave1b/*.png。

注:core/qa/visual-parity 的 compare-all.mjs 硬编码了原作者 Mac 路径 designRoot、compare-page.mjs 不能同时吃 file:// source + token(预存 harness bug,与本次改动无关)——Wave 3 逐页还原把 pixelmatch 当主力工具时一并参数化修掉。

Wave 1 整体 ✅(S1/S2/S3/S4/S7/S8/S9 落地;S6 挪 Wave 3,S2/S7 逐页应用挪 Wave 3/4)。