llm-in-text/.prompt.md

前端代码简化与优化提示词

目标

深入分析并简化前端代码结构，提升执行效率、可维护性和类型安全性。

优化原则

1. 代码简化

• 消除冗余：识别并移除重复的逻辑、条件判断和错误处理模式
• 函数拆分：将大型函数拆分为职责单一的小函数（每个函数只做一件事）
• 提取常量：将魔法数字、字符串字面量提取为命名常量
• 减少嵌套：使用早期返回（early return）替代深层 if/else 嵌套

2. 类型安全

• 明确类型：为所有函数参数和返回值添加 TypeScript 类型注解
• 接口定义：为复杂对象结构定义 interface，避免 any 类型
• 联合类型：使用 discriminated unions 替代运行时 typeof 检查

3. 性能优化

• 懒加载：对非核心模块使用动态 import()
• 防抖节流：对频繁触发的事件（输入、滚动）添加 debounce/throttle
• 计算缓存：对纯函数的重复计算结果进行 memoization
• 条件渲染：使用 v-if/v-show 控制不必要的 DOM 操作

4. 错误处理

• 统一错误边界：集中处理 fetch/API 调用异常
• 有意义错误信息：避免空 catch，提供具体的失败原因
• 降级策略：关键功能失败时有优雅的 fallback

5. 状态管理

• 最小化状态：只存储必要的响应式数据
• 派生状态：使用 computed 替代手动监听 + 条件赋值
• 作用域限制：将状态定义在尽可能小的组件范围内

检查清单

api.js 优化点

// ❌ 问题：过多的条件分支和嵌套
function getCancelUrl(apiUrl) {
  const normalized = String(apiUrl || '').replace(/\/+$/, '')
  if (/\/v1\/pro\/completions$/i.test(normalized)) { /*...*/ }
  if (/\/v1\/web-search$/i.test(normalized)) { /*...*/ }
  // ...
}

// ✅ 优化：使用映射表替代条件链
const CANCEL_PATH_MAP = {
  '/v1/pro/completions': '/v1/pro/completions/cancel',
  '/v1/web-search': '/v1/web-search/cancel',
  '/v1/completions': '/v1/completions/cancel',
}
function getCancelUrl(apiUrl) {
  const base = new URL(apiUrl).pathname.replace(/\/+$/, '')
  return CANCEL_PATH_MAP[base] || `${base}/cancel`
}

通用模式识别

1. 重复的 fetch 包装：提取统一的 safeFetch() 函数处理认证头、错误和超时
2. SSE 解析器重复：将 parseSseEvent 抽象为可复用的 stream 处理器
3. 设置状态访问：避免在每次 API 调用时重新创建 settings store 实例
4. 条件类型检查：用 TypeScript discriminated union 替代运行时 typeof x === 'string'

执行步骤

第一步：分析

1. 使用 grep_search 查找重复模式（相同的 if/else 块、try/catch）
2. 使用 semantic_search 查找相似功能的不同实现
3. 识别高频调用的函数（API 请求、事件处理器）

第二步：重构

1. 提取纯函数：将副作用（fetch、DOM操作）与数据处理分离
2. 创建工具库：将通用逻辑移至 src/utils/ 下的独立模块
3. 添加类型定义：在 src/plugins/types.ts 中集中管理接口
4. 简化条件逻辑：用策略模式或映射表替代 switch/if 链

第三步：验证

1. 运行 npm run build 确认无类型错误
2. 检查 get_errors 确保没有引入新问题
3. 手动测试关键路径（补全、OCR、上传）

输出格式

每次优化后提供：

### 优化项: [函数名/文件名]

**问题**: [简要描述当前代码的问题]

**改动**:
```diff
- // 旧代码
+ // 新代码

收益:

• 行数减少: X%
• 时间复杂度: O(n) → O(1)
• 可读性提升: [具体说明]

## 示例调用

```bash
# 简化 api.js 中的 URL 处理逻辑
"简化 src/utils/api.js 中 getCancelUrl() 函数的条件分支，使用映射表替代正则匹配"

# 优化 copilotPlugin.ts 的类型定义  
"为 src/plugins/copilotPlugin.ts 添加完整的 TypeScript 类型注解，消除所有 any 类型"

# 提取重复的错误处理
"将 src/utils/api.js 中分散的 try/catch 错误处理提取为统一的 errorBoundary() 高阶函数"

注意事项

• ✅ 保持向后兼容：不破坏现有 API 接口和事件流
• ✅ 小步快跑：每次只优化一个函数或模块，验证后再继续
• ❌ 避免过度优化：不要为了炫技引入复杂的函数式编程模式
• ⚠️ 测试覆盖：修改核心路径（补全、取消请求）前确保有对应测试
• 📝 文档同步：更新 CLAUDE.md 和 AGENTS.md 中的架构描述

参考文件

• src/utils/api.js - API 请求层，存在多处可简化的条件逻辑
• src/plugins/copilotPlugin.ts - 补全插件，类型定义不完整
• src/stores/settings.js - 状态管理，可优化响应式依赖
• backend/prompt.py - Prompt 组装逻辑（后端参考）