紧凑模式设计：竞品分析与优化

Ctrl+O 紧凑/详细模式切换 —— 与 Claude Code 的竞品分析、当前实现回顾及优化建议。

用户文档：设置 — ui.compactMode。

1. 概要

Qwen Code 和 Claude Code 都提供了 Ctrl+O 快捷键来切换紧凑和详细工具输出视图，但设计理念、默认状态和交互模式存在根本差异。本文档提供了深入的源码级对比，识别了 UX 差距，并为 Qwen Code 提出了优化方案。

2. Claude Code 实现分析

2.1 架构

Claude Code 使用基于屏幕的方法，而非组件级的渲染切换：

┌──────────────────────────────────┐
│         AppState (Zustand)       │
│  verbose: boolean (default: false)│
│  screen: 'prompt' | 'transcript' │
└──────────┬───────────────────────┘
           │
     ┌─────┴──────┐
     │  Ctrl+O    │  切换屏幕模式
     │  Handler    │  非渲染标志
     └─────┬──────┘
           │
     ┌─────▼──────────────┐
     │    REPL.tsx         │
     │  screen='prompt'  → 紧凑视图 (默认)
     │  screen='transcript'→ 详细视图
     └────────────────────┘

2.2 关键源文件

2.3 设计决策

1. 紧凑是默认。 用户开箱即看到简洁界面；详情是可选操作。
2. 会话范围。 verbose 在每个新会话中重置为 false —— Claude Code 认为用户通常更喜欢紧凑视图，仅临时需要详情。
3. 屏幕级切换。 Ctrl+O 不改变组件的渲染方式；它会将整个显示从 “prompt” 屏幕（紧凑）切换为 “transcript” 屏幕（详细）。
4. 无冻结快照。 不存在快照冻结概念。切换时，显示会立即使用当前状态更新。
5. 权限对话框独立。 工具批准在专用覆盖层中渲染，不受详细/紧凑切换影响。
6. 每个工具的提示。 CtrlOToExpand 组件在单个工具产生较大输出时显示上下文提示，在子代理中隐藏。

2.4 用户流程

会话开始 → 紧凑模式 (默认)
     │
     ├─ 工具输出汇总为单行
     ├─ 大工具输出显示 "(ctrl+o to expand)" 提示
     │
     ├─ 用户按下 Ctrl+O
     │     └─→ 屏幕切换到 transcript (详细视图)
     │         └─ 用户看到所有工具输出、思考过程等
     │
     ├─ 用户再次按下 Ctrl+O
     │     └─→ 屏幕切回 prompt (紧凑)
     │
     └─ 会话结束 → verbose 重置为 false

3. Qwen Code 实现分析

3.1 架构

Qwen Code 使用组件级渲染标志，每个 UI 组件从 context 中读取：

┌─────────────────────────────────────┐
│      CompactModeContext             │
│  compactMode: boolean (default: false)│
│  setCompactMode: (v) => void        │
└──────────┬──────────────────────────┘
           │
     ┌─────┴──────┐
     │  Ctrl+O    │  切换 compactMode
     │  Handler    │  持久化到 settings
     └─────┬──────┘
           │
     ┌─────▼──────────────────┐
     │  每个组件读取           │
     │  compactMode 并         │
     │  决定如何渲染           │
     └────────────────────────┘
           │
     ┌─────▼──────────────────────────────┐
     │  ToolGroupMessage                   │
     │    showCompact = compactMode        │
     │      && !hasConfirmingTool          │
     │      && !hasErrorTool               │
     │      && !isEmbeddedShellFocused     │
     │      && !isUserInitiated            │
     └────────────────────────────────────┘

3.2 关键源文件

3.3 设计决策

1. 详细是默认。 用户默认看到所有工具输出和思考过程。
2. 持久偏好。 compactMode 保存到 settings.json，跨会话持久。
3. 组件级渲染。 每个组件从 context 读取 compactMode 并调整自身渲染。
4. 强制展开保护。 四个条件覆盖紧凑模式，确保关键 UI 元素始终可见（确认、错误、shell、用户触发）。
5. 无冻结快照。 切换始终显示实时输出 —— 无冻结快照。
6. 设置对话框同步。 在设置中切换紧凑模式会通过 setCompactMode 立即更新 React 状态。
7. 非侵入式发现。 紧凑模式通过启动提示轮换而非持久的底部指示器引入，避免 UI 杂乱。

3.4 用户流程

会话开始 → 详细模式 (默认)
     │
     ├─ 所有工具输出、思考过程、详情可见
     │
     ├─ 用户按下 Ctrl+O（或在设置中切换）
     │     └─→ compactMode = true，持久化
     │         ├─ 工具组显示单行摘要
     │         ├─ 思考/思考内容隐藏
     │         └─ 确认、错误、shell 仍展开
     │
     ├─ 用户再次按下 Ctrl+O
     │     └─→ compactMode = false，持久化
     │         └─ 所有详情再次可见
     │
     └─ 下一会话 → 与上次会话相同模式

4. 关键差异深度分析

4.1 默认模式理念

分析： Claude Code 的紧凑默认之所以有效，是因为其用户群体通常是有经验的开发者，他们信任工具且不需要看到每次工具调用。Qwen Code 的详细默认在其早期阶段是合适的，此时通过透明建立用户信任很重要。

4.2 持久化模型

分析： Claude Code 将查看详情视为临时需求 —— 你查看后返回。Qwen Code 将其视为稳定偏好 —— 某些用户始终需要详情，另一些始终需要紧凑。两者都合理；Qwen Code 的方法更灵活。

4.3 确认保护

分析： Claude Code 的架构分离（覆盖层）更健壮。Qwen Code 的强制展开方法有效，但要求每个新的交互状态都明确添加到条件列表中。

4.4 渲染方法

分析： Qwen Code 的组件级方法更灵活（例如，特定条件的强制展开），但需要更多纪律来保持一致性。Claude Code 的屏幕级方法更简单，保证了行为一致。

5. 优化建议

5.1 [P0] 保持详细为默认 —— 无需更改

Qwen Code 的详细默认在其当前阶段是正确的选择。新用户需要透明来建立信任。随着产品成熟，可以考虑将紧凑设为默认（如 Claude Code）。

5.2 [P1] 大型输出的每个工具展开

Claude Code 在产生大型输出的单个工具上显示 “(ctrl+o to expand)“。Qwen Code 目前只有全局切换。考虑：

• 当单个工具输出超过 N 行时，在紧凑模式下显示每个工具的 “展开” 提示。
• 范围：未来增强，当前不是优先事项。

5.3 [P2] 考虑会话范围的临时覆盖

某些用户可能希望紧凑模式作为默认，但偶尔需要在特定会话中使用详细模式。考虑同时支持：

• settings.json → 持久默认（当前行为）
• 会话中的 Ctrl+O → 仅当前会话的临时覆盖（Claude Code 行为）
• 会话重启 → 恢复到 settings.json 的值

这为用户提供了两全其美的体验。实现需要将 “设置默认” 与 “会话覆盖” 状态分离。

5.4 [P2] 确认的结构性分离

目前，确认保护依赖于 ToolGroupMessage 中的 showCompact 条件。考虑更健壮的方法：

• 在单独的层中渲染确认（类似 Claude Code 的覆盖方法）。
• 这将使紧凑模式在架构上不可能影响确认。
• 优先级较低，因为当前的强制展开方法运行正确。

6. 当前实现状态

在 feat/compact-mode-optimization 分支更改之后：

7. 文件参考

Qwen Code

Claude Code (参考)