YoungestSongMo
eb12248a62
【问题】
桌面端（Electron）切换主题时颜色变化速度不一致、明显卡顿。
根因分析（4 轮迭代）：
1. 过渡时长不统一（body 0.3s / 组件 0.15s）→ 统一到 0.2s
2. antd CSS-in-JS 标签替换导致瞬间变色 → 尝试 cssVar（无效，仍走标签替换）
3. applyHtmlTheme 在 updater 回调中执行，与 antd CSS 变更不同帧 → 移入 useLayoutEffect
4. html * 全局过渡在 Electron 中为数千 DOM 节点同步插值 → 合成器掉帧
终极方案：View Transitions API（GPU 合成器 1 次 cross-fade 替代 N 个 CSS 过渡）
+ 精准 CSS 过渡覆盖 ~80 个 antd 容器类（回退方案）
【修改】
ThemeProvider.tsx — 核心重构
- applyHtmlTheme 从 setIsDark updater → useLayoutEffect([isDark])
确保自定义 CSS 变量与 antd CSS-in-JS 在同一次 React 提交中生效
- View Transitions API：document.startViewTransition + flushSync
GPU 合成器截取旧/新两帧做单次 cross-fade，消除多元素插值卡顿
- 浏览器不支持时自动回退到 CSS transition 方案
globals.css — 过渡策略
- body: 0.3s ease → 0.15s linear
- View Transitions 动画：::view-transition-old/new(root) 0.15s linear
- ~80 个 antd 容器类精准过渡（Layout/Card/Modal/Table/Input/
Select/Picker/Menu/Tabs/Tag/Alert/Empty/Result/Skeleton 等）
按功能分组：布局 → 表格 → 表单 → 导航 → 反馈
不覆盖交互组件自有 transition（Button/Switch/Slider 等）
linear 替代 ease — 匀速插值，桌面应用更利落
Layout.tsx / HomeContent.tsx / LeftPanel.tsx / ModelSelector.tsx
- 过渡参数对齐：全部 0.2s → 0.15s linear
SettingsPage.tsx — 用户体验
- Modal 取消 keyboard={false}，Esc 键可关闭
- macOS：关闭按钮移至标题左侧（遵循 macOS HIG）
- afterClose 中 blur 当前焦点元素，防止聚焦跳到导航栏
【文档】
CHANGELOG.md — 新增 0.0.15 版本记录
CLAUDE.md — 新增主题系统架构章节（双轨颜色体系 / 时序 / 过渡策略）
41 lines
585 B
Plaintext
41 lines
585 B
Plaintext
# Logs
|
|
logs
|
|
*.log
|
|
npm-debug.log*
|
|
yarn-debug.log*
|
|
yarn-error.log*
|
|
pnpm-debug.log*
|
|
lerna-debug.log*
|
|
|
|
node_modules
|
|
# vite打包输出
|
|
dist
|
|
# electron打包输出
|
|
dist-electron
|
|
# electron-builder输出
|
|
release
|
|
e2e
|
|
test-results
|
|
dist-ssr
|
|
*.local
|
|
|
|
# 环境变量
|
|
.env # 构建时环境变量（从 .env.example 复制，含 OSS Key 等）
|
|
.env.production # Vite 生产环境变量（含 API 地址）
|
|
|
|
# Editor directories and files
|
|
.vscode
|
|
!.vscode/extensions.json
|
|
.idea
|
|
.DS_Store
|
|
*.suo
|
|
*.ntvs*
|
|
*.njsproj
|
|
*.sln
|
|
*.sw?
|
|
*.py
|
|
*.pyi
|
|
WORKLOG.md
|
|
*openapi*.json
|
|
response_*.json
|