复现 → 隔离 → 定位 → 分析 → 修复 → 验证 → 总结

问题出现
    ↓
在中间点检查
    ↓
问题在前半？─Yes─▶ 检查前半
    │
    No
    ↓
检查后半 ─────▶ 重复直到定位

## 问题复现

### 环境
- OS: [操作系统]
- Node: [版本]
- 浏览器: [如适用]

### 复现步骤
1. [步骤1]
2. [步骤2]
3. [观察到的问题]

### 预期行为
[应该发生什么]

### 实际行为
[实际发生了什么]

### 复现率
[ ] 100% 必现
[ ] 偶现 (约X%)

## 收集的信息

### 错误信息

### 相关日志

### 最近变更
- [最近的代码变更]
- [最近的配置变更]

## 假设清单

| # | 假设 | 验证方法 | 结果 |
|---|------|----------|------|
| 1 | [假设1] | [方法] | ⏳ |
| 2 | [假设2] | [方法] | ⏳ |

// 断点调试
debugger;

// 日志分组
console.group('User Data');
console.log('id:', user.id);
console.log('name:', user.name);
console.groupEnd();

// 表格展示
console.table(users);

// 性能计时
console.time('fetchUsers');
await fetchUsers();
console.timeEnd('fetchUsers');

# 启动调试器
node --inspect app.js

# 使用 Chrome DevTools
chrome://inspect

// 拦截请求
fetch = new Proxy(fetch, {
  apply(target, thisArg, args) {
    console.log('Fetch:', args[0]);
    return target.apply(thisArg, args);
  }
});

// 症状
TypeError: Cannot read property 'x' of undefined

// 调试
console.log('object:', object);  // 检查对象
console.log('type:', typeof object);

// 常见原因
- 异步未等待
- 条件渲染时机
- 数据未初始化

// 症状
数据不是预期值，有时正确有时错误

// 调试
async function debug() {
  console.log('1. before fetch');
  const data = await fetch(...);
  console.log('2. after fetch', data);
  return data;
}

// 常见原因
- 忘记 await
- 竞态条件
- Promise 未处理

// 症状
UI 不更新，状态似乎没变

// 调试
useEffect(() => {
  console.log('state changed:', state);
}, [state]);

// 常见原因
- 直接修改状态（未创建新对象）
- 依赖数组错误
- 闭包陷阱

// 症状
页面卡顿，响应慢

// 调试
console.time('operation');
// ... 操作
console.timeEnd('operation');

// 常见原因
- 大量循环
- 频繁重渲染
- 内存泄漏

## 调试记录

### 问题描述
[简述问题]

### 时间线
- HH:MM 发现问题
- HH:MM 开始调试
- HH:MM 定位根因
- HH:MM 修复完成

### 根因分析
[详细分析]

### 解决方案
[如何修复的]

### 预防措施
[如何避免再次发生]

### 耗时
- 复现: X分钟
- 定位: X分钟
- 修复: X分钟
- 总计: X分钟

// 如果是新类型的问题，记录到 Memory
memory.add({
  category: "lesson_learned",
  content: "[问题描述] 的原因是 [根因]",
  tags: ["debug", "具体问题类型"]
})