From c975e78928eccb212a436ca6c9ae57d2baf89e29 Mon Sep 17 00:00:00 2001
From: kurihada <kurihada@qq.com>
Date: Mon, 24 Nov 2025 14:47:03 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=BE=8E=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ANALYSIS_SUMMARY.md                           |  236 ---
 CODE_ANALYSIS_REPORT.md                       | 1312 -----------------
 LOGIN_STRATEGY.md                             |  273 ----
 OPTIMIZATION_PRIORITIES.md                    |  794 ----------
 SEARCH_API_USAGE.md                           |  207 ---
 TOOL_CALLING_GUIDE.md                         |  300 ----
 src/main/index.ts                             |  137 +-
 .../src/components/ArticleResultCard.vue      |    3 +-
 .../src/components/AssistantMessage.vue       |  264 ++++
 src/renderer/src/components/MessageCard.vue   |  103 +-
 src/renderer/src/components/MessageSearch.vue |  309 ++++
 src/renderer/src/components/SessionList.vue   |  286 ++++
 src/renderer/src/components/ToolCallCard.vue  |   85 +-
 src/renderer/src/services/aiService.ts        |   29 +-
 src/renderer/src/services/sessionManager.ts   |  360 +++++
 src/renderer/src/services/tools.ts            |   31 +-
 src/renderer/src/types/index.ts               |  253 ++++
 src/renderer/src/utils/errorHandler.ts        |  189 +++
 src/renderer/src/views/Chat.vue               |  624 +++++---
 📋_阅读指南.txt                               |  175 ---
 20 files changed, 2296 insertions(+), 3674 deletions(-)
 delete mode 100644 ANALYSIS_SUMMARY.md
 delete mode 100644 CODE_ANALYSIS_REPORT.md
 delete mode 100644 LOGIN_STRATEGY.md
 delete mode 100644 OPTIMIZATION_PRIORITIES.md
 delete mode 100644 SEARCH_API_USAGE.md
 delete mode 100644 TOOL_CALLING_GUIDE.md
 create mode 100644 src/renderer/src/components/AssistantMessage.vue
 create mode 100644 src/renderer/src/components/MessageSearch.vue
 create mode 100644 src/renderer/src/components/SessionList.vue
 create mode 100644 src/renderer/src/services/sessionManager.ts
 create mode 100644 src/renderer/src/types/index.ts
 create mode 100644 src/renderer/src/utils/errorHandler.ts
 delete mode 100644 📋_阅读指南.txt

diff --git a/ANALYSIS_SUMMARY.md b/ANALYSIS_SUMMARY.md
deleted file mode 100644
index 696cf5d..0000000
--- a/ANALYSIS_SUMMARY.md
+++ /dev/null
@@ -1,236 +0,0 @@
-# AI Desktop 项目分析总结
-
-## 项目信息
-- **项目名称**: AI Desktop (AI对话助手)
-- **技术栈**: Electron + Vue 3 + TypeScript + Playwright
-- **核心功能**: AI对话、工具调用（搜索、文章抓取）、小黑盒集成
-- **代码规模**: 
-  - 主进程: 865行
-  - Chat组件: 609行
-  - 工具服务: 304行
-  - 总计: ~1,778行核心代码
-
----
-
-## 五大分析维度
-
-### 1. 性能分析 (🔴 中等-高风险)
-
-**关键问题**:
-- Chat.vue 每处理一个token就调用scrollToBottom，导致60-70%的不必要重渲染
-- localStorage同步全量写入，每次对话都序列化全部消息
-- Playwright浏览器上下文无内存管理，长时间运行可能内存泄漏
-
-**影响**: UI卡顿、响应缓慢、内存占用高
-
-**优化收益**: 性能提升60-70%，内存占用下降50%
-
----
-
-### 2. 用户体验分析 (🟡 中等风险)
-
-**关键问题**:
-- 未登录时搜索失败才提示，应该提前检查
-- 工具调用缺少进度提示，用户不知道进度
-- 文章显示纯文本，不支持Markdown格式
-- 搜索结果重复请求，没有缓存机制
-
-**影响**: 用户困惑、重复操作、体验不流畅
-
-**优化收益**: 用户满意度提升、操作效率提高
-
----
-
-### 3. 代码质量分析 (🔴 高风险)
-
-**关键问题**:
-- Message接口定义了3次，ToolCall接口定义了2次 (类型重复)
-- 错误处理策略不一致 (try-catch vs if检查)
-- 魔法字符串遍布代码 (50, 10, 300, 100等)
-- 缺少TypeScript类型安全 (IPC返回值是any)
-
-**影响**: 维护困难、容易出bug、代码散乱
-
-**优化收益**: 类型错误减少90%，代码维护成本下降50%
-
----
-
-### 4. 功能完善度分析 (🟡 中等风险)
-
-**缺失功能**:
-- 无对话导出/导入功能
-- 无多会话管理，只有单一对话
-- 无消息搜索，无法查找历史
-- 代码块无语法高亮
-- 无快捷键帮助
-
-**影响**: 功能不完整、数据易丢失
-
-**优化收益**: 完整的功能特性集
-
----
-
-### 5. 错误处理分析 (🔴 高风险)
-
-**关键问题**:
-- Playwright进程崩溃无恢复机制
-- 网络错误未区分（401 vs 429 vs 500都一样处理）
-- 工具调用无死循环检测 (AI可能无限调用工具)
-- 工具执行结果无验证
-- 未登录状态处理不完善
-
-**影响**: 应用不稳定、用户体验差、无法排查问题
-
-**优化收益**: 稳定性提升、故障恢复能力增强
-
----
-
-## 15个优化项目
-
-### 高优先级 (P0) - 立即修复
-1. **防抖scrollToBottom** - 减少60-70%不必要渲染
-2. **优化localStorage写入** - 性能提升3-5倍
-3. **统一类型定义** - 从3个接口减到1个
-4. **统一错误处理** - 一致的错误策略
-5. **Playwright进程管理** - 添加重试和crash恢复
-
-### 中优先级 (P1) - 1-2周内改进
-6. **搜索结果缓存** - 减少80%重复请求
-7. **工具调用进度显示** - 改进用户体验
-8. **文章Markdown支持** - 改进内容展示
-9. **提取魔法字符串** - 代码可维护性提升
-10. **死循环检测** - 防止AI无限调用
-
-### 低优先级 (P2) - 1个月内完善
-11. **对话导出/导入** - 数据备份
-12. **多会话管理** - 完整的功能
-13. **消息搜索** - 提高查找效率
-14. **语法高亮** - 改进代码展示
-15. **单元测试** - 代码质量保证
-
----
-
-## 工作量估算
-
-| 阶段 | 优先级 | 项目数 | 工时 | 时间 |
-|------|--------|--------|------|------|
-| 第一阶段 | P0 | 5个 | 11h | 2-3天 |
-| 第二阶段 | P1 | 5个 | 11h | 3-4天 |
-| 第三阶段 | P2 | 5个 | 15h | 持续改进 |
-| **合计** | - | **15个** | **37h** | - |
-
----
-
-## 预期改进效果
-
-### 性能指标
-- 渲染频率: ⬇️ 60-70%
-- localStorage写入: ⬇️ 60%
-- 搜索缓存命中: ⬆️ 80%
-- 浏览器进程稳定性: ⬆️ 80%
-
-### 代码质量
-- 类型错误: ⬇️ 90%
-- 代码重复度: ⬇️ 50%
-- 维护成本: ⬇️ 40%
-
-### 功能完整度
-- 新增功能: +5个
-- 缺陷修复: 30+项
-- 用户体验: ⬆️ 显著
-
----
-
-## 文件输出
-
-已生成以下文件供参考：
-
-1. **CODE_ANALYSIS_REPORT.md** (1312行)
-   - 详细的分析报告
-   - 包含30个具体问题
-   - 每个问题都有代码示例和优化方案
-
-2. **OPTIMIZATION_PRIORITIES.md** (超500行)
-   - 优化优先级表
-   - 每个项目的具体实施步骤
-   - 代码示例和预期效果
-
-3. **ANALYSIS_SUMMARY.md** (本文件)
-   - 快速参考总结
-   - 五大分析维度
-   - 工作量和收益估算
-
----
-
-## 快速开始建议
-
-### 本周 (2-3天)
-完成P0阶段的5个高优先级项目:
-```
-1. 优化localStorage写入 (1h)
-2. 改进登录状态提示 (1h)
-3. 防抖scrollToBottom (2h)
-4. 统一类型和错误处理 (3h)
-5. Playwright进程管理 (3h)
-```
-
-**预期效果**: 性能显著提升，基础稳定性提高
-
-### 下周 (3-4天)
-完成P1阶段的5个中优先级项目:
-```
-6. 提取魔法字符串 (1.5h)
-7. 搜索结果缓存 (2h)
-8. 工具调用进度 (1.5h)
-9. 文章Markdown支持 (1h)
-10. 死循环检测 (2h)
-```
-
-**预期效果**: UX改进，用户反馈好转
-
-### 1个月内
-完成P2阶段的5个功能项目:
-```
-11-15. 对话导出、多会话、消息搜索、语法高亮、单元测试
-```
-
-**预期效果**: 功能完整，质量保证
-
----
-
-## 关键建议
-
-### 立即行动 (今天)
-- [ ] 阅读CODE_ANALYSIS_REPORT.md中的P0-P0-5部分
-- [ ] 评估第一阶段工作量
-- [ ] 优先修复性能问题
-
-### 本周计划
-- [ ] 完成所有P0阶段优化
-- [ ] 建立类型定义文件
-- [ ] 测试性能改进效果
-
-### 后续计划
-- [ ] 制定P1和P2的实施时间表
-- [ ] 建立代码审查流程
-- [ ] 添加单元测试框架
-
----
-
-## 总体结论
-
-该项目**功能完整、架构清晰**，但存在以下主要问题：
-
-1. **性能**: 需要通过防抖和缓存优化 (影响大，工作量小)
-2. **质量**: 需要统一类型和错误处理 (基础设施改进)
-3. **UX**: 需要改进提示和反馈 (用户满意度)
-4. **功能**: 需要添加导出/会话等功能 (增强体验)
-5. **稳定**: 需要改进错误恢复 (可靠性提升)
-
-**建议**: 按照优先级依次解决，第一阶段是关键，必须在2-3天内完成。
-
----
-
-**分析完成日期**: 2024-11-14
-**分析人员**: Claude Code
-**报告版本**: 1.0
diff --git a/CODE_ANALYSIS_REPORT.md b/CODE_ANALYSIS_REPORT.md
deleted file mode 100644
index eb5a9fb..0000000
--- a/CODE_ANALYSIS_REPORT.md
+++ /dev/null
@@ -1,1312 +0,0 @@
-# AI Desktop 项目代码结构分析报告
-
-## 项目概述
-- **类型**: Electron + Vue 3 + TypeScript 桌面应用
-- **功能**: AI对话助手，支持工具调用（搜索、抓取文章）
-- **平台**: 小黑盒游戏社区集成
-- **核心文件**: 
-  - 主进程: `src/main/index.ts` (865行)
-  - Chat视图: `src/renderer/src/views/Chat.vue` (609行)
-  - 工具定义: `src/renderer/src/services/tools.ts` (304行)
-
----
-
-## 一、性能优化点
-
-### 🔴 P0 - 关键性能问题
-
-#### 1. **Chat.vue 中的无限重渲染问题**
-**文件**: `src/renderer/src/views/Chat.vue: Line 267-420`
-
-**问题描述**:
-- 在工具调用循环中，每次迭代都会创建新的Message对象并推送到messages数组
-- 每次创建都会触发`scrollToBottom()`，导致频繁的DOM更新
-- `currentContent`和`toolCall`的更新直接修改lastMessage，造成过度渲染
-
-**代码示例**:
-```typescript
-// 第279-284行：每个token都触发scrollToBottom
-onToken: (token: string) => {
-  currentContent += token
-  const lastMessage = messages.value[messages.value.length - 1]
-  if (lastMessage && lastMessage.role === 'assistant') {
-    lastMessage.content = currentContent
-    scrollToBottom()  // 频繁调用！
-  }
-}
-
-// 第384-392行：循环中多次创建message
-const nextAssistantMessage: Message = {
-  id: (Date.now() + iteration + 1000).toString(),
-  role: 'assistant',
-  content: '',
-  timestamp: new Date(),
-  toolCalls: []
-}
-messages.value.push(nextAssistantMessage)
-scrollToBottom()
-```
-
-**影响**: ⚠️ 高，导致UI卡顿，特别是在工具调用次数多时
-
-**优化方案**:
-```typescript
-// 1. 防抖scrollToBottom
-let scrollTimer: ReturnType<typeof setTimeout> | null = null
-const debouncedScrollToBottom = () => {
-  if (scrollTimer) clearTimeout(scrollTimer)
-  scrollTimer = setTimeout(() => {
-    scrollToBottom()
-  }, 50)
-}
-
-// 2. 批量更新消息而不是逐token更新
-let tokenBuffer = ''
-const flushTokenBuffer = () => {
-  if (tokenBuffer) {
-    const lastMessage = messages.value[messages.value.length - 1]
-    if (lastMessage) lastMessage.content += tokenBuffer
-    tokenBuffer = ''
-    debouncedScrollToBottom()
-  }
-}
-```
-
-#### 2. **localStorage 同步写入性能瓶颈**
-**文件**: `src/renderer/src/views/Chat.vue: Line 467-485`
-
-**问题描述**:
-- `saveMessages()`直接写入localStorage，没有压缩或序列化优化
-- 每次发送消息都会序列化整个messages数组
-- 对于大型对话历史（50条消息），JSON.stringify性能下降明显
-
-**代码**:
-```typescript
-// 第470行
-localStorage.setItem('chat-messages', JSON.stringify(messages.value))
-```
-
-**优化方案**:
-```typescript
-// 1. 只保存最近100条消息
-const saveMessages = (immediate = false) => {
-  const messagesToSave = messages.value.slice(-100)
-  // 2. 压缩工具调用结果（只保存必要信息）
-  const compressed = messagesToSave.map(msg => ({
-    ...msg,
-    toolCalls: msg.toolCalls?.map(tc => ({
-      name: tc.name,
-      status: tc.status,
-      // 不保存完整result，只保存摘要
-      result: tc.result?.substring?.(0, 200)
-    }))
-  }))
-  localStorage.setItem('chat-messages', JSON.stringify(compressed))
-}
-```
-
-#### 3. **主进程中的 Playwright 浏览器上下文持久化问题**
-**文件**: `src/main/index.ts: Line 396-406, 632-641`
-
-**问题描述**:
-- `getPersistentContext()`每次调用都检查并创建新上下文
-- 多个搜索请求会复用同一个chromium进程，但内存泄漏风险大
-- 没有上下文生命周期管理，可能导致内存持续增长
-
-**代码**:
-```typescript
-// 第396-406行
-async function getPersistentContext(headless = true): Promise<BrowserContext> {
-  if (!persistentContext) {
-    persistentContext = await chromium.launchPersistentContext(userDataDir, {
-      headless,
-      viewport: { width: 1280, height: 800 },
-      userAgent: '...'
-    })
-  }
-  return persistentContext
-}
-```
-
-**优化方案**:
-```typescript
-// 1. 添加上下文大小限制
-class ContextManager {
-  private maxPages = 5
-  private pages: Map<string, Page> = new Map()
-  
-  async getPage(): Promise<Page> {
-    if (this.pages.size >= this.maxPages) {
-      const oldestKey = this.pages.keys().next().value
-      const oldPage = this.pages.get(oldestKey)
-      await oldPage?.close()
-      this.pages.delete(oldestKey)
-    }
-    // ...
-  }
-}
-
-// 2. 定期清理内存
-setInterval(async () => {
-  if (persistentContext) {
-    // 清理超过1小时的页面
-  }
-}, 1000 * 60 * 5)
-```
-
----
-
-### 🟡 P1 - 中等性能问题
-
-#### 4. **AI Service 中的 SSE 流处理问题**
-**文件**: `src/renderer/src/services/aiService.ts: Line 240-317`
-
-**问题描述**:
-- 每行都通过`JSON.parse()`单独解析，没有缓存
-- 工具调用参数是字符串，需要多次`JSON.parse()`
-- 没有流式处理优化（应该使用ReadableStream）
-
-**代码**:
-```typescript
-// 第260-265行：逐行JSON.parse
-for (const line of lines) {
-  const trimmedLine = line.trim()
-  if (!trimmedLine || trimmedLine === 'data: [DONE]') continue
-  
-  if (trimmedLine.startsWith('data: ')) {
-    try {
-      const jsonStr = trimmedLine.substring(6)
-      const data = JSON.parse(jsonStr)  // 每行都parse
-```
-
-**优化方案**:
-```typescript
-// 缓存JSON parse结果，使用Try Catch外层
-const parseCache = new Map()
-const safeParse = (str: string) => {
-  if (parseCache.has(str)) return parseCache.get(str)
-  const result = JSON.parse(str)
-  parseCache.set(str, result)
-  return result
-}
-```
-
-#### 5. **MessageCard 组件不必要的重渲染**
-**文件**: `src/renderer/src/components/MessageCard.vue: Line 34-80`
-
-**问题描述**:
-- 每个消息卡片都有完整的MarkdownContent和ToolCallCard渲染
-- 没有使用`computed`缓存格式化时间
-- `formatTime()`在每次渲染时重新计算相对时间
-
-**代码**:
-```typescript
-// 第62-79行：formatTime在每次render都计算
-const formatTime = (date: Date): string => {
-  const now = new Date()
-  const diff = now.getTime() - date.getTime()
-  // ...
-}
-```
-
-**优化方案**:
-```typescript
-// 使用computed缓存，只在Date改变时重新计算
-const formattedTime = computed(() => {
-  if (!props.message.timestamp) return ''
-  return formatTime(props.message.timestamp)
-})
-
-// 添加v-if提前退出
-<MarkdownContent 
-  v-if="message.content" 
-  :content="message.content" 
-/>
-```
-
-#### 6. **ToolsPanel.vue 中的重复 API 调用**
-**文件**: `src/renderer/src/views/ToolsPanel.vue: Line 123-215`
-
-**问题描述**:
-- 搜索和获取文章都调用`executeToolCalls()`，没有缓存
-- 同一个搜索结果被用户点击时会重新fetch整个文章
-- 没有实现请求去重
-
-**代码**:
-```typescript
-// 第212-214行：article-click触发新的fetch
-const handleArticleClick = (url: string) => {
-  articleUrl.value = url
-  handleFetchArticle()  // 每次点击都fetch，即使之前fetch过
-}
-```
-
-**优化方案**:
-```typescript
-const articleCache = new Map<string, any>()
-
-const handleArticleClick = async (url: string) => {
-  if (articleCache.has(url)) {
-    articleResult.value = articleCache.get(url)
-    return
-  }
-  // 否则 fetch 并缓存
-}
-```
-
----
-
-## 二、用户体验改进
-
-### 🔴 P0 - 关键UX问题
-
-#### 7. **缺少加载状态提示和错误处理**
-**文件**: `src/renderer/src/views/Chat.vue: Line 220-445`
-
-**问题描述**:
-- 工具调用失败时，用户不知道是否可以重试
-- 没有进度提示（第几个工具调用在执行）
-- 错误消息不够详细，用户难以了解失败原因
-
-**现象**:
-```typescript
-// 第364-371行：错误只是显示generic message
-} catch (error) {
-  console.error(`Tool call ${i + 1} error:`, error)
-  if (lastMessage && lastMessage.toolCalls && lastMessage.toolCalls[i]) {
-    lastMessage.toolCalls[i].status = 'error'
-    lastMessage.toolCalls[i].result = JSON.stringify({ error: '工具执行失败' })
-    // 没有详细错误信息给用户
-  }
-}
-```
-
-**优化方案**:
-```typescript
-// 1. 增加详细错误信息
-lastMessage.toolCalls[i].result = JSON.stringify({
-  error: '工具执行失败',
-  reason: error.message,
-  suggestion: getSuggestion(error),
-  retryable: isRetryable(error)
-})
-
-// 2. 添加重试按钮
-<ToolCallCard 
-  :tool-call="toolCall"
-  :can-retry="toolCall.status === 'error' && toolCall.retryable"
-  @retry="retryToolCall"
-/>
-```
-
-#### 8. **工具调用进度反馈不清晰**
-**文件**: `src/renderer/src/views/Chat.vue: Line 314-373`
-
-**问题描述**:
-- 工具调用完成后没有总结或完成提示
-- 用户不知道是还有更多工具调用还是已经完成
-- 加载指示器停留时间不确定
-
-**代码现象**:
-```typescript
-// 第321-373行：没有进度指示
-for (let i = 0; i < currentResponse.tool_calls.length; i++) {
-  // 执行工具
-  // 但没有显示 "执行了 i 个/共 total 个工具"
-}
-```
-
-**优化**:
-```typescript
-// 添加进度计数器
-<div class="tool-progress">
-  执行中: {{ currentToolIndex + 1 }} / {{ totalTools }}
-</div>
-```
-
-#### 9. **消息历史加载卡顿**
-**文件**: `src/renderer/src/views/Chat.vue: Line 117-149`
-
-**问题描述**:
-- 初始化时只加载最近50条消息，但没有给用户"加载更多"选项
-- 没有提示用户历史消息被截断
-- localStorage中大量数据未被利用
-
-**代码**:
-```typescript
-// 第133-134行：硬编码50条限制
-const recentMessages = parsed.slice(-50)
-messages.value = recentMessages.map(...)
-```
-
-**优化**:
-```typescript
-// 1. 添加"查看更多历史"功能
-const showMoreHistory = async () => {
-  const offset = messages.value.length - 50
-  if (offset > 0) {
-    const moreMessages = parsed.slice(offset, offset + 50)
-    messages.value.unshift(...moreMessages)
-  }
-}
-
-// 2. UI提示
-<div v-if="hasMoreHistory" class="load-more-button">
-  <el-button @click="showMoreHistory">加载更多历史</el-button>
-</div>
-```
-
-#### 10. **登录状态提示不及时**
-**文件**: `src/renderer/src/services/tools.ts: Line 190-241`
-
-**问题描述**:
-- 搜索失败时才告知用户未登录
-- Settings中登录状态检查不实时（需要点击refresh）
-- 没有自动登录状态同步
-
-**代码**:
-```typescript
-// 第202-211行：搜索时才返回NOT_LOGGED_IN
-if (result.error === 'NOT_LOGGED_IN') {
-  return {
-    success: false,
-    error: 'NOT_LOGGED_IN',
-    message: `搜索 ${platform} 需要登录。请先登录小黑盒账号。`
-  }
-}
-```
-
-**优化**:
-```typescript
-// 1. 在Chat初始化时检查登录状态
-onMounted(async () => {
-  const loginStatus = await window.electron.ipcRenderer.invoke('check-platform-login', {
-    platform: 'xiaoheihe'
-  })
-  if (!loginStatus.isLoggedIn) {
-    ElMessage.warning('请登录小黑盒账号以使用搜索功能')
-  }
-})
-
-// 2. 定期同步登录状态（每5分钟）
-setInterval(syncLoginStatus, 300000)
-```
-
----
-
-### 🟡 P1 - 中等UX问题
-
-#### 11. **搜索结果没有加载更多功能**
-**文件**: `src/renderer/src/components/SearchResultCard.vue`
-
-**问题描述**:
-- 只展示返回的所有结果，没有分页
-- 结果多时UI会很长，难以查找
-
-**优化**:
-```typescript
-// 只显示前10条，添加"查看更多"
-const displayResults = computed(() => 
-  data.results?.slice(0, 10) || []
-)
-
-const hasMore = computed(() => 
-  data.results && data.results.length > 10
-)
-```
-
-#### 12. **文章内容显示不完整**
-**文件**: `src/renderer/src/components/ArticleResultCard.vue: Line 54`
-
-**问题描述**:
-- 文章内容使用`white-space: pre-wrap`显示，不支持HTML或Markdown
-- 长文章显示时没有分页或折叠
-
-**代码**:
-```typescript
-// 第54行：纯文本显示，丢失格式
-<div class="content-text">{{ data.article.content }}</div>
-```
-
-**优化**:
-```vue
-<!-- 支持Markdown格式 -->
-<MarkdownContent 
-  v-if="data.article.content"
-  :content="data.article.content"
-/>
-
-<!-- 长文章添加折叠 -->
-<div v-if="contentLength > 1000" class="content-preview">
-  <el-collapse>
-    <el-collapse-item name="full-content">
-      <template #title>查看完整内容 ({{ contentLength }} 字)</template>
-      <MarkdownContent :content="data.article.content" />
-    </el-collapse-item>
-  </el-collapse>
-</div>
-```
-
----
-
-## 三、代码质量问题
-
-### 🔴 P0 - 关键质量问题
-
-#### 13. **重复的类型定义**
-**文件**: 
-- `Chat.vue: Line 75-88` (ToolCallInfo, Message)
-- `tools.ts: Line 16-30` (ToolCall, ToolResult)
-- `aiService.ts: Line 12-18` (Message)
-
-**问题描述**:
-- Message接口定义了3次
-- ToolCall接口定义了2次
-- 没有单一的真实源头
-
-**优化**:
-```typescript
-// 创建 src/renderer/src/types/index.ts
-export interface Message {
-  id?: string
-  role: 'user' | 'assistant' | 'system' | 'tool'
-  content: string | null
-  timestamp?: Date
-  tool_calls?: ToolCall[]
-  tool_call_id?: string
-  name?: string
-  toolCalls?: ToolCallInfo[]  // 兼容旧格式
-}
-
-export interface ToolCall {
-  id: string
-  type: 'function'
-  function: {
-    name: string
-    arguments: string
-  }
-}
-
-export interface ToolCallInfo {
-  name: string
-  args?: Record<string, any>
-  result?: any
-  status: 'loading' | 'success' | 'error'
-}
-
-// 在各文件中导入
-import type { Message, ToolCall, ToolCallInfo } from '@/types'
-```
-
-#### 14. **错误处理不一致**
-**文件**: 
-- `Chat.vue: Line 256-445` (复杂的error handling)
-- `ToolsPanel.vue: Line 156-165` (简单的error handling)
-- `tools.ts: Line 200-241` (多层error handling)
-
-**问题描述**:
-- 有些地方使用try-catch，有些使用if检查
-- 错误消息格式不一致
-- 没有统一的错误处理策略
-
-**代码示例**:
-```typescript
-// Chat.vue: 复杂的error handling
-try {
-  // ...
-} catch (error: any) {
-  console.error('AI request failed:', error)
-  ElMessage.error(error.message || '请求失败，请检查配置')
-  messages.value = messages.value.filter((msg) => msg.id !== userMessage.id)
-}
-
-// ToolsPanel.vue: 简单的error handling
-} catch (error: any) {
-  console.error('Search failed:', error)
-  ElMessage.error(error.message || '搜索失败')
-}
-
-// tools.ts: if检查
-if (!result.success) {
-  return {
-    success: false,
-    error: result.error || '搜索失败'
-  }
-}
-```
-
-**优化**:
-```typescript
-// 创建统一的错误处理工具
-export class AppError extends Error {
-  constructor(
-    message: string,
-    public code: string,
-    public recoverable: boolean = false
-  ) {
-    super(message)
-  }
-}
-
-// 使用工厂函数创建特定错误
-export const createError = {
-  notLoggedIn: () => new AppError('需要登录', 'NOT_LOGGED_IN', true),
-  networkError: (msg?: string) => new AppError(msg || '网络连接失败', 'NETWORK_ERROR', true),
-  toolExecutionFailed: () => new AppError('工具执行失败', 'TOOL_ERROR', true)
-}
-
-// 统一错误处理
-const handleError = (error: Error) => {
-  if (error instanceof AppError) {
-    ElMessage.error(error.message)
-    if (error.recoverable) {
-      // 显示重试按钮
-    }
-  }
-}
-```
-
-#### 15. **缺少TypeScript类型安全**
-**文件**: `Chat.vue: Line 182-199`
-
-**问题描述**:
-- `getActiveModel()`返回类型为`Promise<ModelConfig | null>`，但ModelConfig接口与实际settings中的类型不匹配
-- 没有在主进程中定义和导出类型
-- IPC调用的返回类型是any
-
-**代码**:
-```typescript
-// 第182-199行：类型不安全
-const getActiveModel = async (): Promise<ModelConfig | null> => {
-  try {
-    const settings = await window.electron.ipcRenderer.invoke('read-settings')
-    // settings类型是any，无法推断出modelConfigs
-    if (!settings.activeModelId) {
-      return null
-    }
-    // ...
-  }
-}
-```
-
-**优化**:
-```typescript
-// 创建共享类型文件 src/shared/types.ts
-export interface ModelConfig {
-  id: string
-  name: string
-  provider: 'openai' | 'deepseek'
-  model: string
-  apiKey: string
-  baseUrl: string
-}
-
-export interface Settings {
-  activeModelId: string | null
-  modelConfigs: ModelConfig[]
-}
-
-// 在Chat.vue中使用
-const getActiveModel = async (): Promise<ModelConfig | null> => {
-  const settings = await window.electron.ipcRenderer.invoke('read-settings') as Settings
-  // 现在settings有正确的类型
-}
-```
-
----
-
-### 🟡 P1 - 中等质量问题
-
-#### 16. **魔法字符串和数字遍布代码**
-**文件**: `Chat.vue, index.ts, tools.ts`
-
-**问题描述**:
-- 硬编码的延迟时间：`setTimeout(..., 100)`, `setTimeout(..., 200)`, `setTimeout(..., 300)`
-- 硬编码的常量：`maxRows: 4`, `minRows: 1`, `-50` (slice)
-- 硬编码的工具名称：`'search_platform'`, `'fetch_article'`
-
-**代码**:
-```typescript
-// Chat.vue: 魔法数字
-setTimeout(() => { ... }, 0)    // 第148行
-setTimeout(() => { ... }, 100)  // 第230行
-setTimeout(() => { ... }, 200)  // 第274行
-setTimeout(() => { ... }, 300)  // 第480行
-await page.goto(url, { waitUntil: 'networkidle', timeout: 30000 })  // 30000?
-const recentMessages = parsed.slice(-50)  // 为什么是50条？
-let maxIterations = 10  // 为什么是10次？
-```
-
-**优化**:
-```typescript
-// 创建 src/renderer/src/constants.ts
-export const TIMEOUTS = {
-  DEFER_MESSAGE_LOAD: 0,
-  ENSURE_IME_READY: 100,
-  ENSURE_RENDERER_READY: 200,
-  DEBOUNCE_SAVE: 300,
-  TOOL_EXECUTION_TIMEOUT: 30000
-} as const
-
-export const LIMITS = {
-  MAX_RECENT_MESSAGES: 50,
-  MAX_TOOL_ITERATIONS: 10,
-  MAX_SEARCH_RESULTS_DISPLAY: 10,
-  ARTICLE_PREVIEW_LENGTH: 1000
-} as const
-
-export const TOOL_NAMES = {
-  CHECK_LOGIN: 'check_platform_login',
-  SEARCH: 'search_platform',
-  FETCH_ARTICLE: 'fetch_article'
-} as const
-
-// 在代码中使用
-setTimeout(() => { ... }, TIMEOUTS.DEFER_MESSAGE_LOAD)
-const recentMessages = parsed.slice(-LIMITS.MAX_RECENT_MESSAGES)
-```
-
-#### 17. **过度复杂的条件检查**
-**文件**: `src/main/index.ts: Line 42-72`
-
-**问题描述**:
-- `SearchRateLimiter.canSearch()`的逻辑可以简化
-- 时间比较逻辑混乱
-
-**代码**:
-```typescript
-// 第42-72行：过度复杂
-canSearch(): { allowed: boolean; waitTime?: number; reason?: string } {
-  const now = Date.now()
-  const timeSinceLastSearch = now - this.lastSearchTime
-
-  if (timeSinceLastSearch > this.resetInterval) {
-    this.searchCount = 0
-  }
-
-  if (this.searchCount >= this.maxSearchPerMinute) {
-    const waitTime = this.resetInterval - timeSinceLastSearch
-    return {
-      allowed: false,
-      waitTime: Math.ceil(waitTime / 1000),
-      reason: '搜索过于频繁，请稍后再试'
-    }
-  }
-
-  if (timeSinceLastSearch < this.minInterval) {
-    const waitTime = this.minInterval - timeSinceLastSearch
-    return {
-      allowed: false,
-      waitTime: Math.ceil(waitTime / 1000),
-      reason: '请求过快，请稍后再试'
-    }
-  }
-
-  return { allowed: true }
-}
-```
-
-**优化**:
-```typescript
-canSearch(): RateLimitResult {
-  const now = Date.now()
-  const elapsed = now - this.lastSearchTime
-
-  // 检查是否需要重置计数
-  if (elapsed > this.resetInterval) {
-    this.searchCount = 0
-  }
-
-  // 检查频率限制（优先级最高）
-  if (this.searchCount >= this.maxSearchPerMinute) {
-    return this.createRateLimitResult(
-      this.resetInterval - elapsed,
-      'RATE_LIMIT_EXCEEDED'
-    )
-  }
-
-  // 检查最小间隔
-  if (elapsed < this.minInterval) {
-    return this.createRateLimitResult(
-      this.minInterval - elapsed,
-      'INTERVAL_LIMIT'
-    )
-  }
-
-  return { allowed: true }
-}
-
-private createRateLimitResult(waitMs: number, reason: string): RateLimitResult {
-  return {
-    allowed: false,
-    waitTime: Math.ceil(waitMs / 1000),
-    reason: this.getReason(reason)
-  }
-}
-```
-
-#### 18. **缺少单元测试和错误覆盖**
-**文件**: 项目整体
-
-**问题描述**:
-- 没有单元测试文件
-- 没有集成测试
-- 错误情况未经过测试
-
-**优化方案**:
-```typescript
-// 创建 src/renderer/src/services/__tests__/tools.test.ts
-import { describe, it, expect, vi, beforeEach } from 'vitest'
-import { ToolExecutor } from '../tools'
-
-describe('ToolExecutor', () => {
-  let executor: ToolExecutor
-
-  beforeEach(() => {
-    executor = new ToolExecutor()
-  })
-
-  it('should handle platform login check', async () => {
-    const toolCall = {
-      id: 'test-1',
-      type: 'function' as const,
-      function: {
-        name: 'check_platform_login',
-        arguments: JSON.stringify({ platform: 'xiaoheihe' })
-      }
-    }
-
-    const result = await executor.execute(toolCall)
-    expect(result.role).toBe('tool')
-    expect(result.name).toBe('check_platform_login')
-  })
-
-  it('should handle invalid arguments', async () => {
-    const toolCall = {
-      id: 'test-2',
-      type: 'function' as const,
-      function: {
-        name: 'search_platform',
-        arguments: '{invalid json}'
-      }
-    }
-
-    const result = await executor.execute(toolCall)
-    expect(result.content).toContain('参数解析失败')
-  })
-})
-```
-
----
-
-## 四、功能完善
-
-### 🔴 P0 - 缺失的关键功能
-
-#### 19. **缺少对话导出功能**
-**问题描述**:
-- 用户无法导出对话历史
-- 没有分享功能
-- 数据只存在localStorage中，易丢失
-
-**建议**:
-```typescript
-// 添加导出功能
-const exportChat = () => {
-  const data = {
-    version: '1.0',
-    exportDate: new Date().toISOString(),
-    messages: messages.value
-  }
-  
-  const json = JSON.stringify(data, null, 2)
-  const blob = new Blob([json], { type: 'application/json' })
-  const url = URL.createObjectURL(blob)
-  const a = document.createElement('a')
-  a.href = url
-  a.download = `chat-${Date.now()}.json`
-  a.click()
-  URL.revokeObjectURL(url)
-}
-
-// 添加导入功能
-const importChat = async (file: File) => {
-  const text = await file.text()
-  const data = JSON.parse(text)
-  messages.value = [
-    ...messages.value,
-    ...data.messages
-  ]
-  saveMessages(true)
-}
-```
-
-#### 20. **缺少对话收藏/标记功能**
-**问题描述**:
-- 用户无法标记重要对话
-- 没有分类功能
-- 对话历史平铺，难以找到之前的对话
-
-**建议**:
-```typescript
-interface ChatSession {
-  id: string
-  title: string
-  createdAt: Date
-  messages: Message[]
-  starred: boolean
-  tags: string[]
-}
-
-// 在localStorage中分别存储sessions和当前session
-const currentSessionId = ref<string>()
-const sessions = ref<ChatSession[]>([])
-
-const createNewSession = () => {
-  const session: ChatSession = {
-    id: Date.now().toString(),
-    title: `对话 ${new Date().toLocaleDateString()}`,
-    createdAt: new Date(),
-    messages: [],
-    starred: false,
-    tags: []
-  }
-  sessions.value.push(session)
-  currentSessionId.value = session.id
-}
-```
-
-#### 21. **缺少Markdown语法高亮**
-**文件**: `src/renderer/src/components/MarkdownContent.vue`
-
-**问题描述**:
-- markdown中的代码块没有语法高亮
-- 使用了marked库但没有配置高亮器
-
-**优化**:
-```typescript
-// 安装 npm install highlight.js
-import { marked } from 'marked'
-import { markedHighlight } from 'marked-highlight'
-import hljs from 'highlight.js'
-import 'highlight.js/styles/atom-one-dark.css'
-
-marked.use(
-  markedHighlight({
-    langPrefix: 'hljs language-',
-    highlight(code, lang) {
-      const language = hljs.getLanguage(lang) ? lang : 'plaintext'
-      return hljs.highlight(code, { language }).value
-    }
-  })
-)
-```
-
-#### 22. **缺少快捷键帮助**
-**问题描述**:
-- 用户不知道有Command+K快捷键
-- 没有快捷键提示菜单
-- 可发现性差
-
-**建议**:
-```typescript
-// 添加快捷键帮助面板
-const showShortcutHelp = () => {
-  ElDialog.confirm('快捷键列表', 'OK').then(() => {
-    // 显示快捷键列表
-  })
-}
-
-// 在Chat组件中按 ? 显示帮助
-window.addEventListener('keydown', (e) => {
-  if (e.key === '?') {
-    showShortcutHelp()
-  }
-})
-```
-
----
-
-### 🟡 P1 - 建议添加的功能
-
-#### 23. **添加消息搜索功能**
-```typescript
-const searchMessages = (query: string) => {
-  return messages.value.filter(msg => 
-    msg.content.toLowerCase().includes(query.toLowerCase())
-  )
-}
-```
-
-#### 24. **添加对话主题切换**
-```typescript
-const themes = {
-  light: { /* ... */ },
-  dark: { /* ... */ }
-}
-
-const setTheme = (name: keyof typeof themes) => {
-  localStorage.setItem('app-theme', name)
-  // 应用主题
-}
-```
-
-#### 25. **添加消息撤回/编辑功能**
-```typescript
-interface Message {
-  id: string
-  // ...
-  editable: boolean
-  editHistory?: string[]
-}
-
-const editMessage = (messageId: string, newContent: string) => {
-  const msg = messages.value.find(m => m.id === messageId)
-  if (msg) {
-    msg.editHistory?.push(msg.content)
-    msg.content = newContent
-  }
-}
-```
-
----
-
-## 五、错误处理和异常情况
-
-### 🔴 P0 - 关键错误处理缺陷
-
-#### 26. **Playwright 浏览器崩溃未处理**
-**文件**: `src/main/index.ts: Line 352-393`
-
-**问题描述**:
-- 浏览器进程意外结束时没有恢复机制
-- fetchArticleContent()不能重试
-- persistentContext崩溃后不会重新创建
-
-**代码**:
-```typescript
-// 第352-393行：没有错误恢复
-async function fetchArticleContent(url: string): Promise<{ /* ... */ }> {
-  let browser
-  try {
-    browser = await chromium.launch({ headless: true })
-    // ... 如果这里崩溃，browser会是undefined
-  } finally {
-    if (browser) {
-      // 但如果browser进程已经死了呢？
-      await browser.close()
-    }
-  }
-}
-```
-
-**优化**:
-```typescript
-// 添加重试逻辑和错误恢复
-async function fetchArticleContentWithRetry(
-  url: string,
-  maxRetries = 3
-): Promise<ArticleContent> {
-  for (let i = 0; i < maxRetries; i++) {
-    try {
-      return await fetchArticleContent(url)
-    } catch (error) {
-      if (i === maxRetries - 1) throw error
-      // 等待后重试
-      await new Promise(resolve => setTimeout(resolve, 1000 * (i + 1)))
-    }
-  }
-}
-
-// 添加crash检测
-persistentContext?.on?.('disconnected', () => {
-  console.log('Browser context disconnected, will recreate on next use')
-  persistentContext = null
-})
-```
-
-#### 27. **网络错误未区分**
-**文件**: `src/renderer/src/services/aiService.ts: Line 230-234`
-
-**问题描述**:
-- 所有失败都用同一个错误消息
-- 无法区分网络错误、API错误、超时等
-- 用户无法采取相应的行动
-
-**代码**:
-```typescript
-// 第230-234行：所有错误都一样
-const response = await fetch(endpoint, {
-  // ...
-})
-
-if (!response.ok) {
-  const errorText = await response.text()
-  throw new Error(`API 请求失败: ${response.status} ${errorText}`)
-}
-```
-
-**优化**:
-```typescript
-class APIError extends Error {
-  constructor(
-    message: string,
-    public status: number,
-    public responseText: string
-  ) {
-    super(message)
-    this.name = 'APIError'
-  }
-}
-
-class NetworkError extends Error {
-  constructor(message: string) {
-    super(message)
-    this.name = 'NetworkError'
-  }
-}
-
-// 更好的错误处理
-const response = await fetch(endpoint, {
-  // ...
-}).catch((error) => {
-  if (error instanceof TypeError) {
-    throw new NetworkError('网络连接失败，请检查网络设置')
-  }
-  throw error
-})
-
-if (!response.ok) {
-  const errorText = await response.text()
-  
-  if (response.status === 401) {
-    throw new APIError('API Key 无效或已过期', 401, errorText)
-  } else if (response.status === 429) {
-    throw new APIError('请求过于频繁，请稍后再试', 429, errorText)
-  } else if (response.status >= 500) {
-    throw new APIError('服务器错误，请稍后重试', response.status, errorText)
-  }
-  
-  throw new APIError('API 请求失败', response.status, errorText)
-}
-```
-
-#### 28. **工具调用死循环未防护**
-**文件**: `src/renderer/src/views/Chat.vue: Line 320-424`
-
-**问题描述**:
-- maxIterations硬编码为10
-- 如果AI不断生成工具调用，会浪费资源
-- 没有检测无限循环的模式
-
-**代码**:
-```typescript
-// 第320-424行：简单的maxIterations检查
-while (currentResponse.tool_calls && currentResponse.tool_calls.length > 0 && iteration < maxIterations) {
-  // ...
-  if (iteration >= maxIterations) {
-    console.warn('Reached maximum tool call iterations')
-    ElMessage.warning('工具调用次数过多，已停止')
-  }
-}
-```
-
-**优化**:
-```typescript
-// 检测模式：如果连续的工具调用相同，则认为可能是循环
-const toolCallHistory: string[] = []
-
-while (currentResponse.tool_calls && /* ... */) {
-  const toolNames = currentResponse.tool_calls.map(tc => tc.function.name)
-  const currentPattern = toolNames.join(',')
-  
-  // 检查是否重复相同的工具调用
-  if (toolCallHistory[toolCallHistory.length - 1] === currentPattern &&
-      toolCallHistory[toolCallHistory.length - 2] === currentPattern) {
-    ElMessage.error('检测到可能的死循环，已停止')
-    break
-  }
-  
-  toolCallHistory.push(currentPattern)
-  if (toolCallHistory.length > 10) {
-    toolCallHistory.shift()
-  }
-  
-  // ...
-  iteration++
-}
-```
-
-#### 29. **未登录状态处理不完善**
-**文件**: `src/renderer/src/services/tools.ts: Line 201-241`
-
-**问题描述**:
-- 搜索时才发现未登录，用户已输入查询
-- Settings中登录状态检查不够频繁
-- 没有自动刷新登录状态
-
-**优化**:
-```typescript
-// 在Chat.vue中启动时检查
-onMounted(() => {
-  // ... 现有代码
-
-  // 检查登录状态
-  checkLoginStatus()
-  
-  // 定期检查登录状态（每5分钟）
-  const checkInterval = setInterval(() => {
-    checkLoginStatus()
-  }, 300000)
-
-  onUnmounted(() => {
-    clearInterval(checkInterval)
-  })
-})
-
-const checkLoginStatus = async () => {
-  const result = await window.electron.ipcRenderer.invoke('check-platform-login', {
-    platform: 'xiaoheihe'
-  })
-  
-  if (!result.isLoggedIn) {
-    isLoggedIn.value = false
-    // 禁用搜索相关功能
-  } else {
-    isLoggedIn.value = true
-  }
-}
-
-// 在模板中
-<el-button
-  type="primary"
-  :disabled="!isLoggedIn"
-  @click="handleSearch"
->
-  搜索
-</el-button>
-
-<div v-if="!isLoggedIn" class="login-warning">
-  需要登录才能使用搜索功能
-  <el-button link @click="openSettings">立即登录</el-button>
-</div>
-```
-
-#### 30. **工具执行结果验证缺失**
-**文件**: `src/renderer/src/services/tools.ts: Line 98-161`
-
-**问题描述**:
-- 工具执行结果没有验证
-- 返回的数据格式可能不符合预期
-- 没有null/undefined检查
-
-**代码**:
-```typescript
-// 第104-116行：直接返回result，没有验证
-let args: any
-try {
-  args = JSON.parse(argsStr)
-  console.log('Parsed arguments:', args)
-} catch (error) {
-  console.error('Failed to parse tool arguments:', error)
-  return {
-    tool_call_id: id,
-    role: 'tool',
-    name,
-    content: JSON.stringify({ error: '参数解析失败', details: String(error) })
-  }
-}
-```
-
-**优化**:
-```typescript
-// 使用Zod进行运行时验证
-import { z } from 'zod'
-
-const ToolResultSchema = z.object({
-  success: z.boolean(),
-  error: z.string().optional(),
-  results: z.array(z.any()).optional(),
-  message: z.string().optional()
-})
-
-async execute(toolCall: ToolCall): Promise<ToolResult> {
-  // ... 执行工具
-  
-  try {
-    // 验证结果格式
-    const validated = ToolResultSchema.parse(result)
-    
-    return {
-      tool_call_id: id,
-      role: 'tool',
-      name,
-      content: JSON.stringify(validated)
-    }
-  } catch (error) {
-    console.error('Tool result validation failed:', error)
-    return {
-      tool_call_id: id,
-      role: 'tool',
-      name,
-      content: JSON.stringify({
-        error: '工具结果格式错误',
-        details: error.message
-      })
-    }
-  }
-}
-```
-
----
-
-## 优化建议优先级排序
-
-### 第一阶段（高优先级）- 立即修复
-1. **P0-01**: 防抖scrollToBottom，减少re-render
-2. **P0-02**: 优化localStorage写入
-3. **P0-03**: 统一错误处理和类型定义
-4. **P0-04**: 改进登录状态提示
-5. **P0-05**: 处理Playwright进程崩溃
-
-### 第二阶段（中优先级）- 1-2周内
-6. **P1-01**: 缓存搜索结果和文章
-7. **P1-02**: 添加工具调用进度提示
-8. **P1-03**: 改进文章显示（支持Markdown）
-9. **P1-04**: 提取魔法字符串为常量
-10. **P1-05**: 工具调用死循环检测
-
-### 第三阶段（低优先级）- 1个月内
-11. **P2-01**: 添加对话导出/导入功能
-12. **P2-02**: 实现多对话会话管理
-13. **P2-03**: 添加消息搜索功能
-14. **P2-04**: 语法高亮
-15. **P2-05**: 单元测试
-
----
-
-## 检查清单
-
-- [ ] 实现防抖scrollToBottom
-- [ ] 优化localStorage存储结构
-- [ ] 创建统一的types/index.ts
-- [ ] 创建AppError错误类
-- [ ] 创建constants.ts文件
-- [ ] 添加登录状态检查
-- [ ] 实现搜索结果缓存
-- [ ] 添加工具调用重试逻辑
-- [ ] 改进文章预览显示
-- [ ] 添加单元测试框架
-
----
-
-## 总结
-
-该项目是一个功能完整的AI对话工具，但存在以下主要问题：
-
-1. **性能**: 频繁重渲染、localStorage同步写入、浏览器进程管理不善
-2. **UX**: 缺少加载状态、错误恢复、登录状态提示
-3. **代码质量**: 类型定义重复、魔法字符串、错误处理不一致
-4. **功能完善度**: 缺少导出、会话管理、语法高亮
-
-建议按照优先级逐步改进，特别是第一阶段的5个关键问题应该立即修复。
diff --git a/LOGIN_STRATEGY.md b/LOGIN_STRATEGY.md
deleted file mode 100644
index 41cf584..0000000
--- a/LOGIN_STRATEGY.md
+++ /dev/null
@@ -1,273 +0,0 @@
-# 搜索功能登录策略设计
-
-## 问题背景
-
-小黑盒平台的搜索功能需要用户登录才能使用。我们需要设计一个用户体验友好的策略来处理这个限制。
-
-## 产品设计方案
-
-### 核心原则
-
-1. **用户体验优先** - 不让用户感到困惑或受阻
-2. **信息透明** - 清晰告知用户为什么需要登录
-3. **操作便捷** - 提供简单快速的登录路径
-4. **智能判断** - 避免不必要的提示和检查
-
-### 方案：渐进式提示 + 自动引导
-
-#### 1. 静默检查（不打扰用户）
-
-在执行搜索前，使用 `checkLoginStatusFast()` 快速检查登录状态：
-
-```typescript
-// 优点：
-// - 基于 cookie 检查，不需要加载页面
-// - 速度快（< 100ms）
-// - 用户无感知
-
-const loginStatus = await this.checkLoginStatusFast(context)
-```
-
-#### 2. 智能响应（根据登录状态）
-
-**场景 A: 已登录用户**
-- ✅ 直接执行搜索
-- ✅ 无任何提示
-- ✅ 正常返回搜索结果
-
-**场景 B: 未登录用户**
-- ⚠️ 返回特殊错误码 `NOT_LOGGED_IN`
-- 📝 AI 收到友好的错误信息
-- 🔑 提供登录引导
-
-#### 3. AI 友好的错误响应
-
-```json
-{
-  "success": false,
-  "error": "NOT_LOGGED_IN",
-  "message": "搜索小黑盒需要登录。请先登录小黑盒账号。",
-  "needLogin": true,
-  "platform": "xiaoheihe",
-  "loginGuide": "你可以通过以下方式登录：\n1. 点击设置按钮\n2. 扫描二维码登录小黑盒账号\n3. 登录成功后即可使用搜索功能"
-}
-```
-
-AI 会自动将这些信息转化成用户友好的回复。
-
-## 用户交互流程
-
-### 流程图
-
-```
-用户: "去小黑盒搜索三角洲行动"
-        ↓
-   检查登录状态
-        ↓
-   ┌────┴────┐
-   │         │
-已登录     未登录
-   │         │
-   ↓         ↓
-执行搜索   返回登录提示
-   │         │
-   ↓         ↓
-返回结果   AI 引导登录
-```
-
-### 实际对话示例
-
-#### 示例 1: 已登录用户
-
-```
-👤 用户: 去小黑盒搜索三角洲行动的更新日志
-
-🤖 AI: 🔧 正在调用工具: search_platform
-      ⚙️ 正在执行工具...
-      ✅ 工具执行完成
-
-      我为您找到了 12 条关于三角洲行动的更新日志：
-
-      1. 【官方】三角洲行动 v1.2.0 更新公告
-         发布时间: 2小时前
-         点赞: 2456, 评论: 891
-         ...
-```
-
-#### 示例 2: 未登录用户
-
-```
-👤 用户: 去小黑盒搜索三角洲行动的更新日志
-
-🤖 AI: 抱歉，搜索小黑盒需要先登录账号。
-
-      📱 登录方式：
-      1. 点击右上角的设置按钮 ⚙️
-      2. 扫描二维码登录小黑盒账号
-      3. 登录成功后，重新发送您的搜索请求即可
-
-      登录后我就可以帮您搜索相关内容了！
-```
-
-#### 示例 3: 用户登录后再次尝试
-
-```
-👤 用户: 好的，我已经登录了，再搜索一次
-
-🤖 AI: 🔧 正在调用工具: search_platform
-      ⚙️ 正在执行工具...
-      ✅ 工具执行完成
-
-      太好了！现在我为您找到了相关内容：
-      [搜索结果...]
-```
-
-## 技术实现
-
-### 1. 后端检查（xiaoheihe.ts）
-
-```typescript
-async search(context: BrowserContext, query: string) {
-  // 快速检查登录状态
-  const loginStatus = await this.checkLoginStatusFast(context)
-
-  if (!loginStatus.isLoggedIn) {
-    return {
-      success: false,
-      error: 'NOT_LOGGED_IN',
-      results: []
-    }
-  }
-
-  // 执行搜索...
-}
-```
-
-### 2. 工具执行器处理（tools.ts）
-
-```typescript
-private async searchPlatform(platform: string, query: string) {
-  const result = await window.electron.ipcRenderer.invoke('search-platform', {
-    platform,
-    query
-  })
-
-  if (result.error === 'NOT_LOGGED_IN') {
-    return {
-      success: false,
-      error: 'NOT_LOGGED_IN',
-      message: `搜索 ${platform} 需要登录。请先登录小黑盒账号。`,
-      needLogin: true,
-      loginGuide: '登录步骤...'
-    }
-  }
-
-  // 返回搜索结果...
-}
-```
-
-### 3. AI 自动处理
-
-AI 收到工具返回的错误信息后，会自然地向用户解释并引导登录。
-
-## 优势
-
-### ✅ 用户体验优势
-
-1. **无感知检查** - 登录状态检查速度快，用户无感知
-2. **清晰提示** - 未登录时，清楚告知原因和解决方法
-3. **简化流程** - 提供一键式的登录引导
-4. **智能对话** - AI 自然地引导用户完成登录
-
-### ✅ 技术优势
-
-1. **性能优化** - 使用 `checkLoginStatusFast()` 避免加载页面
-2. **错误分级** - 通过错误码区分不同类型的失败
-3. **可扩展性** - 可以轻松添加其他平台的登录检查
-4. **容错性强** - 即使检查失败，也能优雅降级
-
-### ✅ 产品优势
-
-1. **降低摩擦** - 用户第一次使用就能得到清晰的指引
-2. **提升转化** - 明确的登录引导提高登录率
-3. **用户留存** - 良好的体验提升用户满意度
-4. **减少困惑** - 避免用户不知道为什么功能无法使用
-
-## 未来优化方向
-
-### 1. 自动唤起登录（优先级：高）
-
-当检测到未登录时，可以自动弹出登录窗口：
-
-```typescript
-if (!loginStatus.isLoggedIn) {
-  // 自动打开登录窗口
-  window.electron.ipcRenderer.send('open-login-window', {
-    platform: 'xiaoheihe',
-    returnTo: 'search',
-    query: query
-  })
-}
-```
-
-### 2. 登录状态缓存（优先级：中）
-
-缓存登录状态 5 分钟，避免频繁检查：
-
-```typescript
-private loginStatusCache = new Map<string, {
-  status: boolean,
-  timestamp: number
-}>()
-
-async checkLoginWithCache(platform: string) {
-  const cached = this.loginStatusCache.get(platform)
-  if (cached && Date.now() - cached.timestamp < 5 * 60 * 1000) {
-    return cached.status
-  }
-  // 重新检查...
-}
-```
-
-### 3. 访客模式支持（优先级：低）
-
-如果平台支持，提供有限的访客搜索功能：
-
-```typescript
-if (!loginStatus.isLoggedIn) {
-  // 尝试访客模式搜索
-  const guestResult = await this.searchAsGuest(query)
-  if (guestResult.success) {
-    return {
-      ...guestResult,
-      isGuestMode: true,
-      message: '当前为访客模式，搜索结果可能有限'
-    }
-  }
-}
-```
-
-### 4. 多账号支持（优先级：低）
-
-支持用户同时登录多个账号：
-
-```typescript
-const accounts = await this.getLoggedInAccounts(platform)
-if (accounts.length > 1) {
-  // 让用户选择使用哪个账号搜索
-}
-```
-
-## 总结
-
-这个方案在**用户体验**、**技术实现**和**产品目标**之间取得了良好的平衡：
-
-- ✅ 不会让用户感到困惑
-- ✅ 不会阻断用户的操作流程
-- ✅ 提供了清晰的问题解决路径
-- ✅ 为未来的优化留下了空间
-
-用户会感受到：
-1. AI 很智能，知道需要登录
-2. 提示很清楚，知道如何登录
-3. 流程很顺畅，登录后立即可用
diff --git a/OPTIMIZATION_PRIORITIES.md b/OPTIMIZATION_PRIORITIES.md
deleted file mode 100644
index 0572950..0000000
--- a/OPTIMIZATION_PRIORITIES.md
+++ /dev/null
@@ -1,794 +0,0 @@
-# AI Desktop 项目优化优先级表
-
-## 快速参考
-
-| 优先级 | 类别 | 问题 | 影响 | 难度 | 预计工作量 |
-|-------|------|------|------|------|----------|
-| P0-1 | 性能 | Chat.vue 无限重渲染 | 🔴 高 | ⭐⭐ 中 | 2h |
-| P0-2 | 性能 | localStorage 同步写入 | 🔴 高 | ⭐ 易 | 1h |
-| P0-3 | 质量 | 重复类型定义 + 错误处理 | 🔴 高 | ⭐⭐⭐ 难 | 3h |
-| P0-4 | UX | 登录状态提示不及时 | 🟡 中 | ⭐ 易 | 1h |
-| P0-5 | 错误 | Playwright 进程崩溃 | 🔴 高 | ⭐⭐⭐ 难 | 3h |
-| P1-1 | 性能 | 搜索结果缓存 | 🟡 中 | ⭐⭐ 中 | 2h |
-| P1-2 | UX | 工具调用进度反馈 | 🟡 中 | ⭐ 易 | 1.5h |
-| P1-3 | 功能 | 文章Markdown支持 | 🟡 中 | ⭐ 易 | 1h |
-| P1-4 | 质量 | 魔法字符串提取 | 🟡 中 | ⭐ 易 | 1.5h |
-| P1-5 | 错误 | 死循环检测 | 🟡 中 | ⭐⭐ 中 | 2h |
-| P2-1 | 功能 | 对话导出/导入 | 🟢 低 | ⭐⭐ 中 | 3h |
-| P2-2 | 功能 | 多会话管理 | 🟢 低 | ⭐⭐⭐ 难 | 5h |
-| P2-3 | 功能 | 消息搜索 | 🟢 低 | ⭐ 易 | 1h |
-| P2-4 | 功能 | 语法高亮 | 🟢 低 | ⭐⭐ 中 | 2h |
-| P2-5 | 质量 | 单元测试 | 🟢 低 | ⭐⭐⭐ 难 | 4h |
-
----
-
-## 第一阶段：立即修复（1-2天，共11小时）
-
-### 1. P0-2：优化 localStorage 写入 [1小时]
-**位置**: `src/renderer/src/views/Chat.vue: Line 467-485`
-
-**立即行动**:
-```typescript
-// 只保存最近100条消息，压缩工具结果
-const messagesToSave = messages.value.slice(-100)
-const compressed = messagesToSave.map(msg => ({
-  id: msg.id,
-  role: msg.role,
-  content: msg.content,
-  timestamp: msg.timestamp,
-  toolCalls: msg.toolCalls?.map(tc => ({
-    name: tc.name,
-    status: tc.status,
-    result: tc.result?.substring?.(0, 100)  // 只保存前100字
-  }))
-}))
-localStorage.setItem('chat-messages', JSON.stringify(compressed))
-```
-
-**期望效果**: localStorage写入速度提升3-5倍
-
----
-
-### 2. P0-4：改进登录状态提示 [1小时]
-**位置**: `src/renderer/src/views/Chat.vue, Settings.vue`
-
-**立即行动**:
-```typescript
-// Chat.vue onMounted中添加
-const isLoggedIn = ref(false)
-
-onMounted(async () => {
-  // 检查登录状态
-  const result = await window.electron.ipcRenderer.invoke('check-platform-login', {
-    platform: 'xiaoheihe'
-  })
-  isLoggedIn.value = result.isLoggedIn
-  
-  if (!isLoggedIn.value) {
-    ElMessage.warning('请登录小黑盒账号以使用搜索功能')
-  }
-})
-
-// 定期检查（每5分钟）
-const checkInterval = setInterval(async () => {
-  const result = await window.electron.ipcRenderer.invoke('check-platform-login', {
-    platform: 'xiaoheihe'
-  })
-  isLoggedIn.value = result.isLoggedIn
-}, 300000)
-```
-
-**期望效果**: 用户在输入搜索前就知道是否需要登录
-
----
-
-### 3. P0-1：防抖scrollToBottom [2小时]
-**位置**: `src/renderer/src/views/Chat.vue: Line 267-420`
-
-**立即行动**:
-```typescript
-// 防抖滚动
-let scrollTimer: ReturnType<typeof setTimeout> | null = null
-const debouncedScrollToBottom = () => {
-  if (scrollTimer) clearTimeout(scrollTimer)
-  scrollTimer = setTimeout(() => {
-    scrollToBottom()
-    scrollTimer = null
-  }, 50)
-}
-
-// 替换所有 scrollToBottom() 为 debouncedScrollToBottom()
-// 修改 onToken 回调
-onToken: (token: string) => {
-  currentContent += token
-  const lastMessage = messages.value[messages.value.length - 1]
-  if (lastMessage && lastMessage.role === 'assistant') {
-    lastMessage.content = currentContent
-    debouncedScrollToBottom()  // 改这里
-  }
-}
-```
-
-**期望效果**: 渲染次数减少60-70%
-
----
-
-### 4. P0-3：统一类型定义和错误处理 [3小时]
-
-#### 步骤 1: 创建 `src/shared/types.ts`
-```typescript
-export interface Message {
-  id: string
-  role: 'user' | 'assistant' | 'system' | 'tool'
-  content: string | null
-  timestamp?: Date
-  tool_calls?: ToolCall[]
-  tool_call_id?: string
-  name?: string
-  toolCalls?: ToolCallInfo[]  // 兼容旧格式
-}
-
-export interface ToolCall {
-  id: string
-  type: 'function'
-  function: {
-    name: string
-    arguments: string
-  }
-}
-
-export interface ToolCallInfo {
-  name: string
-  args?: Record<string, any>
-  result?: any
-  status: 'loading' | 'success' | 'error'
-}
-
-export interface ModelConfig {
-  id: string
-  name: string
-  provider: 'openai' | 'deepseek'
-  model: string
-  apiKey: string
-  baseUrl: string
-}
-
-export interface Settings {
-  activeModelId: string | null
-  modelConfigs: ModelConfig[]
-}
-```
-
-#### 步骤 2: 创建 `src/renderer/src/utils/errors.ts`
-```typescript
-export class AppError extends Error {
-  constructor(
-    message: string,
-    public code: string,
-    public recoverable: boolean = false,
-    public context?: Record<string, any>
-  ) {
-    super(message)
-    this.name = 'AppError'
-  }
-}
-
-export const createError = {
-  notLoggedIn: (platform: string) => 
-    new AppError(
-      `需要登录 ${platform}`,
-      'NOT_LOGGED_IN',
-      true,
-      { platform }
-    ),
-  networkError: (msg?: string) => 
-    new AppError(msg || '网络连接失败', 'NETWORK_ERROR', true),
-  toolError: (toolName: string) => 
-    new AppError(
-      `${toolName} 执行失败`,
-      'TOOL_ERROR',
-      true,
-      { tool: toolName }
-    )
-}
-
-export const handleError = (error: Error) => {
-  if (error instanceof AppError) {
-    console.error(`[${error.code}] ${error.message}`, error.context)
-    return {
-      message: error.message,
-      recoverable: error.recoverable,
-      code: error.code
-    }
-  }
-  console.error('Unexpected error:', error)
-  return {
-    message: '发生了一个错误',
-    recoverable: false,
-    code: 'UNKNOWN'
-  }
-}
-```
-
-#### 步骤 3: 更新导入
-- `Chat.vue`: `import type { Message } from '@/shared/types'`
-- `aiService.ts`: `import type { Message, ToolCall } from '@/shared/types'`
-- `tools.ts`: `import type { ToolCall } from '@/shared/types'`
-
-**期望效果**: 类型安全提升，类型定义从3个减少到1个
-
----
-
-### 5. P0-5：处理Playwright进程崩溃 [3小时]
-**位置**: `src/main/index.ts: Line 396-406, 352-393`
-
-**立即行动**:
-```typescript
-// 添加重试机制
-async function fetchArticleContentWithRetry(
-  url: string,
-  maxRetries = 3
-): Promise<any> {
-  for (let attempt = 0; attempt < maxRetries; attempt++) {
-    try {
-      console.log(`[fetchArticle] Attempt ${attempt + 1}/${maxRetries}`)
-      return await fetchArticleContent(url)
-    } catch (error) {
-      if (attempt === maxRetries - 1) throw error
-      
-      // 指数退避
-      const delay = 1000 * Math.pow(2, attempt)
-      console.log(`[fetchArticle] Retry after ${delay}ms`)
-      await new Promise(resolve => setTimeout(resolve, delay))
-    }
-  }
-}
-
-// 添加disconnected事件处理
-async function getPersistentContext(headless = true): Promise<BrowserContext> {
-  if (!persistentContext) {
-    persistentContext = await chromium.launchPersistentContext(userDataDir, {
-      headless,
-      viewport: { width: 1280, height: 800 },
-      userAgent: '...'
-    })
-    
-    // 监听断开连接事件
-    persistentContext.once('disconnected', () => {
-      console.log('[Browser] Context disconnected')
-      persistentContext = null
-    })
-  }
-  return persistentContext
-}
-
-// 使用 fetchArticleContentWithRetry 替换 fetchArticleContent
-ipcMain.handle('fetch-article', async (_, url: string) => {
-  try {
-    const result = await fetchArticleContentWithRetry(url)
-    return { success: true, ...result }
-  } catch (error) {
-    return {
-      success: false,
-      error: error instanceof Error ? error.message : '抓取文章失败'
-    }
-  }
-})
-```
-
-**期望效果**: 偶发性浏览器崩溃导致的请求失败减少80%
-
----
-
-## 第二阶段：改进体验（1-2周，共11小时）
-
-### 6. P1-4：提取魔法字符串 [1.5小时]
-
-创建 `src/renderer/src/constants.ts`:
-```typescript
-export const TIMEOUTS = {
-  DEFER_MESSAGE_LOAD: 0,
-  ENSURE_IME_READY: 100,
-  ENSURE_RENDERER_READY: 200,
-  DEBOUNCE_SAVE: 300,
-  DEBOUNCE_SCROLL: 50,
-  TOOL_EXECUTION_TIMEOUT: 30000
-} as const
-
-export const LIMITS = {
-  MAX_RECENT_MESSAGES: 50,
-  MAX_MESSAGE_STORAGE: 100,
-  MAX_TOOL_ITERATIONS: 10,
-  MAX_SEARCH_RESULTS_DISPLAY: 10,
-  ARTICLE_PREVIEW_LENGTH: 1000,
-  ARTICLE_RESULT_PREVIEW: 200,
-  SEARCH_MIN_INTERVAL: 3000,
-  SEARCH_MAX_PER_MINUTE: 10
-} as const
-
-export const TOOL_NAMES = {
-  CHECK_LOGIN: 'check_platform_login',
-  SEARCH: 'search_platform',
-  FETCH_ARTICLE: 'fetch_article'
-} as const
-
-export const PLATFORMS = {
-  XIAOHEIHE: 'xiaoheihe'
-} as const
-```
-
-在代码中使用:
-```typescript
-// 之前
-const recentMessages = parsed.slice(-50)
-setTimeout(() => { ... }, 300)
-
-// 之后
-import { LIMITS, TIMEOUTS } from '@/constants'
-const recentMessages = parsed.slice(-LIMITS.MAX_RECENT_MESSAGES)
-setTimeout(() => { ... }, TIMEOUTS.DEBOUNCE_SAVE)
-```
-
----
-
-### 7. P1-1：搜索结果缓存 [2小时]
-
-在 `src/renderer/src/views/ToolsPanel.vue` 中:
-```typescript
-// 添加缓存
-const articleCache = new Map<string, any>()
-const searchCache = new Map<string, any>()
-
-const handleSearch = async () => {
-  if (!searchQuery.value.trim() || searchLoading.value) return
-  
-  const cacheKey = `search:${searchQuery.value}`
-  if (searchCache.has(cacheKey)) {
-    searchResult.value = searchCache.get(cacheKey)
-    return
-  }
-
-  try {
-    searchLoading.value = true
-    searchResult.value = null
-
-    const toolCall = { /* ... */ }
-    const results = await executeToolCalls([toolCall])
-    const toolResult = results[0]
-    const parsedResult = JSON.parse(toolResult.content)
-    
-    searchResult.value = parsedResult
-    searchCache.set(cacheKey, parsedResult)
-  } finally {
-    searchLoading.value = false
-  }
-}
-
-const handleArticleClick = async (url: string) => {
-  articleUrl.value = url
-  
-  // 先检查缓存
-  if (articleCache.has(url)) {
-    articleResult.value = articleCache.get(url)
-    return
-  }
-  
-  await handleFetchArticle()
-}
-
-const handleFetchArticle = async () => {
-  if (!articleUrl.value.trim() || fetchLoading.value) return
-  
-  // 检查缓存
-  if (articleCache.has(articleUrl.value)) {
-    articleResult.value = articleCache.get(articleUrl.value)
-    return
-  }
-
-  try {
-    fetchLoading.value = true
-    articleResult.value = null
-
-    const toolCall = { /* ... */ }
-    const results = await executeToolCalls([toolCall])
-    const toolResult = results[0]
-    const parsedResult = JSON.parse(toolResult.content)
-    
-    articleResult.value = parsedResult
-    articleCache.set(articleUrl.value, parsedResult)
-  } finally {
-    fetchLoading.value = false
-  }
-}
-```
-
----
-
-### 8. P1-2：工具调用进度提示 [1.5小时]
-
-修改 `src/renderer/src/views/Chat.vue`:
-```typescript
-// 添加进度跟踪
-const toolProgress = ref({
-  current: 0,
-  total: 0
-})
-
-// 在循环前设置总数
-while (currentResponse.tool_calls && /* ... */) {
-  toolProgress.value.total = currentResponse.tool_calls.length
-  
-  for (let i = 0; i < currentResponse.tool_calls.length; i++) {
-    toolProgress.value.current = i + 1
-    
-    try {
-      const results = await executeToolCalls([currentResponse.tool_calls[i]])
-      // ...
-    } catch (error) {
-      // ...
-    }
-  }
-}
-
-// 在模板中显示进度
-<div v-if="toolProgress.total > 0" class="tool-progress">
-  工具执行进度: {{ toolProgress.current }} / {{ toolProgress.total }}
-</div>
-```
-
----
-
-### 9. P1-3：文章Markdown支持 [1小时]
-
-修改 `src/renderer/src/components/ArticleResultCard.vue`:
-```vue
-<template>
-  <div class="article-result-card">
-    <!-- 保持现有错误处理 -->
-    
-    <div v-else-if="data.article" class="article-content">
-      <!-- 保持meta和stats -->
-      
-      <div class="article-body">
-        <!-- 改这里：支持Markdown -->
-        <MarkdownContent 
-          v-if="data.article.content"
-          :content="data.article.content"
-        />
-        
-        <!-- 或者如果太长，显示预览 -->
-        <el-collapse v-if="contentLength > 1000">
-          <el-collapse-item name="full-content">
-            <template #title>查看完整内容 ({{ contentLength }} 字)</template>
-            <MarkdownContent :content="data.article.content" />
-          </el-collapse-item>
-        </el-collapse>
-      </div>
-      
-      <!-- 保持现有评论展示 -->
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import MarkdownContent from './MarkdownContent.vue'
-
-// 添加计算属性
-const contentLength = computed(() => data.article?.content?.length || 0)
-</script>
-```
-
----
-
-### 10. P1-5：死循环检测 [2小时]
-
-修改 `src/renderer/src/views/Chat.vue`:
-```typescript
-// 在工具调用循环中添加检测
-const toolCallHistory: string[] = []
-const MAX_IDENTICAL_PATTERNS = 2
-
-while (currentResponse.tool_calls && /* ... */) {
-  const toolNames = currentResponse.tool_calls.map(tc => tc.function.name)
-  const currentPattern = toolNames.join(',')
-  
-  // 检测模式重复
-  const lastPattern = toolCallHistory[toolCallHistory.length - 1]
-  if (lastPattern === currentPattern) {
-    const lastLastPattern = toolCallHistory[toolCallHistory.length - 2]
-    if (lastLastPattern === currentPattern) {
-      console.warn('检测到死循环模式:', currentPattern)
-      ElMessage.error('检测到可能的无限循环，已停止工具调用')
-      break
-    }
-  }
-  
-  toolCallHistory.push(currentPattern)
-  if (toolCallHistory.length > 10) {
-    toolCallHistory.shift()
-  }
-  
-  // ... 继续执行工具调用
-}
-```
-
----
-
-## 第三阶段：功能完善（1个月，共15小时）
-
-### 11. P2-1：对话导出/导入 [3小时]
-
-创建 `src/renderer/src/utils/chatExport.ts`:
-```typescript
-export interface ChatExport {
-  version: '1.0'
-  exportDate: string
-  messages: any[]
-}
-
-export const exportChat = (messages: any[]): void => {
-  const data: ChatExport = {
-    version: '1.0',
-    exportDate: new Date().toISOString(),
-    messages
-  }
-  
-  const json = JSON.stringify(data, null, 2)
-  const blob = new Blob([json], { type: 'application/json' })
-  const url = URL.createObjectURL(blob)
-  const a = document.createElement('a')
-  a.href = url
-  a.download = `chat-export-${Date.now()}.json`
-  a.click()
-  URL.revokeObjectURL(url)
-}
-
-export const importChat = async (file: File): Promise<ChatExport> => {
-  const text = await file.text()
-  const data = JSON.parse(text) as ChatExport
-  return data
-}
-```
-
-在 Chat.vue 中使用:
-```typescript
-const exportChat = () => {
-  chatExport.exportChat(messages.value)
-  ElMessage.success('对话已导出')
-}
-
-const importChat = async (file: File) => {
-  try {
-    const data = await chatExport.importChat(file)
-    if (data.version !== '1.0') {
-      throw new Error('不支持的版本')
-    }
-    
-    messages.value = [
-      ...messages.value,
-      ...data.messages.map(m => ({
-        ...m,
-        timestamp: new Date(m.timestamp)
-      }))
-    ]
-    saveMessages(true)
-    ElMessage.success('对话已导入')
-  } catch (error) {
-    ElMessage.error('导入失败:' + error.message)
-  }
-}
-```
-
----
-
-### 12. P2-3：消息搜索 [1小时]
-
-在 Chat.vue 中添加:
-```typescript
-const searchQuery = ref('')
-const searchResults = computed(() => {
-  if (!searchQuery.value) return []
-  
-  const query = searchQuery.value.toLowerCase()
-  return messages.value.filter(msg =>
-    msg.content.toLowerCase().includes(query)
-  )
-})
-
-// 在模板中添加搜索框
-<el-input
-  v-model="searchQuery"
-  placeholder="搜索消息..."
-  @keydown.enter="focusFirstSearchResult"
-/>
-
-<div v-if="searchQuery && searchResults.length > 0" class="search-results">
-  找到 {{ searchResults.length }} 条结果
-</div>
-```
-
----
-
-### 13. P2-4：语法高亮 [2小时]
-
-修改 `src/renderer/src/components/MarkdownContent.vue`:
-```typescript
-import { marked } from 'marked'
-import { markedHighlight } from 'marked-highlight'
-import hljs from 'highlight.js'
-import 'highlight.js/styles/atom-one-dark.css'
-
-marked.use(
-  markedHighlight({
-    langPrefix: 'hljs language-',
-    highlight(code, lang) {
-      const language = hljs.getLanguage(lang) ? lang : 'plaintext'
-      return hljs.highlight(code, { language }).value
-    }
-  })
-)
-```
-
-安装包:
-```bash
-npm install highlight.js marked-highlight
-```
-
----
-
-### 14. P2-2：多会话管理 [5小时]
-
-创建 `src/renderer/src/stores/chatSessions.ts`:
-```typescript
-import { defineStore } from 'pinia'
-import { ref, computed } from 'vue'
-
-interface ChatSession {
-  id: string
-  title: string
-  createdAt: Date
-  updatedAt: Date
-  messages: Message[]
-  starred: boolean
-  tags: string[]
-}
-
-export const useChatSessions = defineStore('chatSessions', () => {
-  const sessions = ref<ChatSession[]>([])
-  const currentSessionId = ref<string | null>(null)
-
-  const currentSession = computed(() => 
-    sessions.value.find(s => s.id === currentSessionId.value)
-  )
-
-  const createSession = () => {
-    const session: ChatSession = {
-      id: Date.now().toString(),
-      title: `对话 ${new Date().toLocaleDateString()}`,
-      createdAt: new Date(),
-      updatedAt: new Date(),
-      messages: [],
-      starred: false,
-      tags: []
-    }
-    sessions.value.push(session)
-    currentSessionId.value = session.id
-    return session
-  }
-
-  return {
-    sessions,
-    currentSessionId,
-    currentSession,
-    createSession
-  }
-})
-```
-
----
-
-### 15. P2-5：单元测试 [4小时]
-
-安装 vitest:
-```bash
-npm install -D vitest @vitest/ui @testing-library/vue
-```
-
-创建 `src/renderer/src/services/__tests__/tools.test.ts`:
-```typescript
-import { describe, it, expect, beforeEach, vi } from 'vitest'
-import { ToolExecutor } from '../tools'
-
-describe('ToolExecutor', () => {
-  let executor: ToolExecutor
-
-  beforeEach(() => {
-    executor = new ToolExecutor()
-  })
-
-  describe('execute', () => {
-    it('should handle invalid JSON arguments', async () => {
-      const toolCall = {
-        id: 'test-1',
-        type: 'function' as const,
-        function: {
-          name: 'search_platform',
-          arguments: '{invalid}'
-        }
-      }
-
-      const result = await executor.execute(toolCall)
-      expect(result.content).toContain('参数解析失败')
-    })
-
-    it('should return tool result with correct structure', async () => {
-      const toolCall = {
-        id: 'test-2',
-        type: 'function' as const,
-        function: {
-          name: 'check_platform_login',
-          arguments: JSON.stringify({ platform: 'xiaoheihe' })
-        }
-      }
-
-      const result = await executor.execute(toolCall)
-      expect(result.tool_call_id).toBe('test-2')
-      expect(result.role).toBe('tool')
-      expect(result.name).toBe('check_platform_login')
-    })
-  })
-})
-```
-
----
-
-## 快速检查清单
-
-### 立即检查
-- [ ] 是否有频繁的console.log警告？
-- [ ] localStorage中有多少条消息？
-- [ ] 搜索相同内容会显示缓存吗？
-- [ ] 工具调用失败时有详细错误吗？
-- [ ] 未登录时搜索会有提示吗？
-
-### 一周内完成
-- [ ] 滚动是否流畅了？
-- [ ] 消息保存是否快了？
-- [ ] 代码中还有重复的类型吗？
-- [ ] 工具调用有进度显示吗？
-- [ ] 文章能显示Markdown吗？
-
-### 一个月内完成
-- [ ] 有导出/导入功能吗？
-- [ ] 能搜索消息吗？
-- [ ] 代码有单元测试吗？
-- [ ] 代码块有语法高亮吗？
-
----
-
-## 预期改进效果
-
-| 指标 | 改进前 | 改进后 | 提升 |
-|------|-------|-------|------|
-| 渲染频率 (token处理) | 每token 1次 | 每50ms 1次 | ⬇️ 60-70% |
-| localStorage写入 | 同步全量 | 异步压缩 | ⬇️ 60% |
-| 搜索重复率 | 0% (无缓存) | 80% (缓存命中) | ⬆️ 80% |
-| 类型错误 | 中等 | 几乎无 | ⬇️ 90% |
-| 首次登录检查 | 无 | 启动时进行 | ✓ 新增 |
-
----
-
-## 总工作量统计
-
-| 阶段 | 项目数 | 总工时 | 优先级 |
-|------|-------|--------|--------|
-| 第一阶段 | 5个 | 11小时 | P0 |
-| 第二阶段 | 5个 | 11小时 | P1 |
-| 第三阶段 | 5个 | 15小时 | P2 |
-| **合计** | **15个** | **37小时** | - |
-
-**建议分配**: 
-- 第一阶段（P0）: 本周完成（2-3天）
-- 第二阶段（P1）: 下周完成（3-4天）
-- 第三阶段（P2）: 第3-4周完成（持续改进）
-
diff --git a/SEARCH_API_USAGE.md b/SEARCH_API_USAGE.md
deleted file mode 100644
index cfb604d..0000000
--- a/SEARCH_API_USAGE.md
+++ /dev/null
@@ -1,207 +0,0 @@
-# 搜索 API 使用说明
-
-## 概述
-
-该 API 允许 AI 在指定平台上搜索内容，目前支持小黑盒平台。
-
-## API 接口
-
-### 搜索平台内容
-
-**IPC Channel:** `search-platform`
-
-**参数:**
-```typescript
-{
-  platform: string,  // 平台名称，如 'xiaoheihe'
-  query: string      // 搜索关键词
-}
-```
-
-**返回值:**
-```typescript
-{
-  success: boolean,
-  results?: Array<{
-    title: string,           // 文章标题
-    url: string,             // 文章链接
-    author?: string,         // 作者名称
-    publishTime?: string,    // 发布时间
-    summary?: string,        // 摘要
-    commentCount?: number,   // 评论数
-    likeCount?: number       // 点赞数
-  }>,
-  error?: string
-}
-```
-
-## 使用示例
-
-### 在 Vue 组件中使用
-
-```typescript
-// 在 Chat.vue 或其他组件中
-
-const searchXiaoheihe = async (query: string) => {
-  try {
-    const result = await window.electron.ipcRenderer.invoke('search-platform', {
-      platform: 'xiaoheihe',
-      query: query
-    })
-
-    if (result.success && result.results) {
-      console.log(`找到 ${result.results.length} 条结果:`)
-      result.results.forEach((item, index) => {
-        console.log(`${index + 1}. ${item.title}`)
-        console.log(`   链接: ${item.url}`)
-        console.log(`   作者: ${item.author || '未知'}`)
-        console.log(`   时间: ${item.publishTime || '未知'}`)
-        console.log(`   摘要: ${item.summary || '无'}`)
-        console.log(`   评论: ${item.commentCount || 0}, 点赞: ${item.likeCount || 0}`)
-        console.log('---')
-      })
-
-      return result.results
-    } else {
-      console.error('搜索失败:', result.error)
-      return []
-    }
-  } catch (error) {
-    console.error('搜索异常:', error)
-    return []
-  }
-}
-
-// 使用示例
-const results = await searchXiaoheihe('三角洲行动更新日志')
-```
-
-### AI Tool 集成示例
-
-如果你要将此功能集成到 AI 的 tool calling 中，可以这样定义：
-
-```json
-{
-  "name": "search_platform",
-  "description": "在指定平台搜索内容，获取相关文章列表",
-  "parameters": {
-    "type": "object",
-    "properties": {
-      "platform": {
-        "type": "string",
-        "enum": ["xiaoheihe"],
-        "description": "要搜索的平台名称，目前支持: xiaoheihe（小黑盒）"
-      },
-      "query": {
-        "type": "string",
-        "description": "搜索关键词，例如：'三角洲行动最新版本更新日志'"
-      }
-    },
-    "required": ["platform", "query"]
-  }
-}
-```
-
-### 获取搜索结果中文章的详细内容
-
-搜索返回的 `url` 可以配合现有的 `fetch-article` API 来获取完整文章内容：
-
-```typescript
-// 1. 先搜索
-const searchResult = await window.electron.ipcRenderer.invoke('search-platform', {
-  platform: 'xiaoheihe',
-  query: '三角洲行动更新'
-})
-
-// 2. 获取第一条结果的详细内容
-if (searchResult.success && searchResult.results && searchResult.results.length > 0) {
-  const firstResult = searchResult.results[0]
-
-  const articleDetail = await window.electron.ipcRenderer.invoke('fetch-article', firstResult.url)
-
-  if (articleDetail.success) {
-    console.log('文章标题:', articleDetail.title)
-    console.log('文章内容:', articleDetail.content)
-    console.log('评论列表:', articleDetail.comments)
-    console.log('统计数据:', articleDetail.stats)
-  }
-}
-```
-
-## 完整工作流程示例
-
-用户说："去小黑盒查询三角洲的最新版本更新日志"
-
-AI 的处理流程：
-
-```typescript
-async function handleUserRequest(userQuery: string) {
-  // 1. 解析用户意图
-  // 用户想要：在小黑盒搜索"三角洲最新版本更新日志"
-
-  // 2. 调用搜索 API
-  const searchResult = await window.electron.ipcRenderer.invoke('search-platform', {
-    platform: 'xiaoheihe',
-    query: '三角洲 更新日志'
-  })
-
-  if (!searchResult.success) {
-    return `搜索失败: ${searchResult.error}`
-  }
-
-  if (!searchResult.results || searchResult.results.length === 0) {
-    return '没有找到相关内容'
-  }
-
-  // 3. 筛选最相关的结果（可以根据标题、时间等判断）
-  const mostRelevant = searchResult.results[0] // 简单取第一条
-
-  // 4. 获取文章详细内容
-  const articleDetail = await window.electron.ipcRenderer.invoke('fetch-article', mostRelevant.url)
-
-  if (!articleDetail.success) {
-    return `获取文章详情失败: ${articleDetail.error}`
-  }
-
-  // 5. 提取更新日志相关内容并返回给用户
-  return `
-找到最新的更新日志：
-
-**${articleDetail.title}**
-
-发布时间: ${articleDetail.publishTime || '未知'}
-作者: ${articleDetail.author || '官方'}
-
-内容摘要：
-${articleDetail.content.substring(0, 500)}...
-
-完整链接: ${mostRelevant.url}
-
-互动数据：
-- 点赞: ${articleDetail.stats?.likes || 0}
-- 评论: ${articleDetail.stats?.commentCount || 0}
-- 收藏: ${articleDetail.stats?.favorites || 0}
-  `
-}
-```
-
-## 支持的平台
-
-- ✅ `xiaoheihe` - 小黑盒游戏社区
-
-## 注意事项
-
-1. 搜索功能会打开浏览器页面进行搜索，可能需要几秒钟
-2. 搜索结果的准确性取决于平台的搜索算法
-3. 如果需要登录才能搜索，请确保用户已经登录对应平台
-4. 返回的搜索结果数量取决于平台的搜索结果页面结构
-
-## 错误处理
-
-常见错误：
-
-- `搜索关键词不能为空` - query 参数为空
-- `不支持的平台` - platform 参数不在支持列表中
-- `未找到平台服务` - 平台服务未正确注册
-- `搜索失败` - 网络错误或页面结构变化
-- `未找到相关结果` - 搜索成功但没有结果
diff --git a/TOOL_CALLING_GUIDE.md b/TOOL_CALLING_GUIDE.md
deleted file mode 100644
index a7aa9d4..0000000
--- a/TOOL_CALLING_GUIDE.md
+++ /dev/null
@@ -1,300 +0,0 @@
-# AI Tool Calling 使用指南
-
-## 概述
-
-AI Desktop 现已支持完整的 Tool Calling（函数调用）功能！AI 可以自动调用工具来完成复杂任务，如搜索平台内容、获取文章详情等。
-
-## 🎯 支持的工具
-
-### 1. `search_platform` - 搜索平台内容
-
-在指定平台搜索内容，获取相关文章列表。
-
-**参数：**
-- `platform` (string, 必需): 平台名称，目前支持 `xiaoheihe`（小黑盒）
-- `query` (string, 必需): 搜索关键词
-
-**返回：**
-- `success` (boolean): 是否成功
-- `count` (number): 结果数量
-- `results` (array): 搜索结果列表
-  - `title`: 文章标题
-  - `url`: 文章链接
-  - `author`: 作者名称
-  - `publishTime`: 发布时间
-  - `summary`: 摘要
-  - `commentCount`: 评论数
-  - `likeCount`: 点赞数
-
-**示例：**
-```
-用户: 去小黑盒查询三角洲行动的最新更新日志
-
-AI 会自动调用:
-{
-  "platform": "xiaoheihe",
-  "query": "三角洲行动 更新日志"
-}
-```
-
-### 2. `fetch_article` - 获取文章详情
-
-获取指定 URL 的文章详细内容。
-
-**参数：**
-- `url` (string, 必需): 文章的完整 URL 地址
-
-**返回：**
-- `success` (boolean): 是否成功
-- `article` (object): 文章详情
-  - `title`: 标题
-  - `author`: 作者
-  - `publishTime`: 发布时间
-  - `content`: 正文内容
-  - `tags`: 标签列表
-  - `stats`: 统计数据（点赞、收藏、评论数等）
-  - `topComments`: 前5条评论
-
-**示例：**
-```
-用户: 帮我看看这篇文章的详细内容
-
-AI 会自动调用:
-{
-  "url": "https://www.xiaoheihe.cn/article/123456"
-}
-```
-
-## 🚀 使用方式
-
-### 方式一：自然语言对话（推荐）
-
-直接用自然语言告诉 AI 你想做什么，AI 会自动判断是否需要调用工具。
-
-**示例对话：**
-
-```
-👤 用户: 去小黑盒搜索一下黑神话悟空的最新攻略
-
-🤖 AI: 🔧 正在调用工具: search_platform
-      ⚙️ 正在执行工具...
-      ✅ 工具执行完成
-
-      我为您找到了 15 条关于黑神话悟空的最新攻略：
-
-      1. 【黑神话悟空】全Boss打法攻略合集
-         作者: 游戏大神
-         发布时间: 2小时前
-         点赞: 1234, 评论: 567
-
-      2. 黑神话悟空隐藏关卡完全指南
-         ...
-```
-
-```
-👤 用户: 帮我看看第一篇文章的详细内容
-
-🤖 AI: 🔧 正在调用工具: fetch_article
-      ⚙️ 正在执行工具...
-      ✅ 工具执行完成
-
-      这篇文章详细介绍了黑神话悟空中所有Boss的打法策略：
-
-      【文章标题】全Boss打法攻略合集
-      【作者】游戏大神
-      【发布时间】2小时前
-
-      【正文内容】
-      第一章：黑风山
-      1. 黑熊精：
-         - 阶段一：...
-         - 阶段二：...
-      ...
-```
-
-### 方式二：连续对话
-
-AI 可以在一次对话中自动调用多个工具。
-
-```
-👤 用户: 去小黑盒查询三角洲行动的最新版本更新日志，然后告诉我主要更新了什么
-
-🤖 AI:
-      🔧 正在调用工具: search_platform
-      ⚙️ 正在执行工具...
-      🔧 正在调用工具: fetch_article
-      ⚙️ 正在执行工具...
-      ✅ 工具执行完成
-
-      根据最新的更新日志，三角洲行动 v1.2.0 主要更新内容包括：
-
-      1. 新增武器系统
-         - 新增 5 把新武器
-         - 优化武器平衡性
-
-      2. 地图更新
-         - 新地图「城市废墟」
-         - 优化现有地图性能
-
-      3. Bug修复
-         - 修复了 23 个已知问题
-         - 优化了网络延迟
-
-      完整更新日志链接：https://...
-```
-
-## 💡 支持的使用场景
-
-### 1. 搜索游戏资讯
-```
-- "去小黑盒搜索原神最新活动"
-- "查询王者荣耀新赛季更新"
-- "搜索黑神话悟空的评测"
-```
-
-### 2. 获取详细攻略
-```
-- "帮我看看这篇攻略的详细内容"
-- "获取这个链接的文章内容"
-- "这篇文章都说了什么？"
-```
-
-### 3. 综合查询
-```
-- "去小黑盒搜索三角洲行动的更新，然后总结主要内容"
-- "查询最新的游戏新闻，帮我挑出最重要的3条"
-- "搜索某某游戏的评价，告诉我玩家都在说什么"
-```
-
-## 🔧 技术实现
-
-### 架构说明
-
-1. **工具定义** (`tools.ts`)
-   - 定义所有可用工具的接口和参数
-   - 实现工具执行器 `ToolExecutor`
-
-2. **AI 服务** (`aiService.ts`)
-   - `chatWithTools`: 支持 tool calling 的聊天函数
-   - `executeToolCalls`: 执行工具调用并返回结果
-   - 支持流式响应和工具调用通知
-
-3. **界面集成** (`Chat.vue`)
-   - 自动检测 AI 的工具调用
-   - 执行工具并显示进度提示
-   - 将工具结果返回给 AI 生成最终回复
-
-### 工作流程
-
-```
-用户输入
-   ↓
-发送给 AI (携带工具定义)
-   ↓
-AI 分析是否需要调用工具
-   ↓
-如果需要: 返回 tool_calls
-   ↓
-执行工具调用 (search_platform / fetch_article)
-   ↓
-将工具结果添加到对话历史
-   ↓
-再次发送给 AI
-   ↓
-AI 基于工具结果生成最终回复
-   ↓
-显示给用户
-```
-
-## 📝 添加新工具
-
-如果你想添加新的工具，按照以下步骤：
-
-### 1. 在 `tools.ts` 中定义工具
-
-```typescript
-export const availableTools: ToolDefinition[] = [
-  // ... 现有工具
-  {
-    type: 'function',
-    function: {
-      name: 'your_tool_name',
-      description: '工具的详细描述，AI 会根据这个描述判断何时使用',
-      parameters: {
-        type: 'object',
-        properties: {
-          param1: {
-            type: 'string',
-            description: '参数1的描述'
-          },
-          param2: {
-            type: 'number',
-            description: '参数2的描述'
-          }
-        },
-        required: ['param1']
-      }
-    }
-  }
-]
-```
-
-### 2. 在 `ToolExecutor` 中实现工具
-
-```typescript
-async execute(toolCall: ToolCall): Promise<ToolResult> {
-  // ... 现有代码
-  switch (name) {
-    case 'your_tool_name':
-      result = await this.yourToolFunction(args.param1, args.param2)
-      break
-    // ...
-  }
-}
-
-private async yourToolFunction(param1: string, param2: number): Promise<any> {
-  // 实现工具逻辑
-  // 可以调用 IPC、API 或执行其他操作
-  return { success: true, data: ... }
-}
-```
-
-### 3. 如果需要新的 IPC 接口
-
-在主进程 (`main/index.ts`) 中添加：
-
-```typescript
-ipcMain.handle('your-ipc-channel', async (_, args) => {
-  // 实现功能
-  return { success: true, ... }
-})
-```
-
-## ⚠️ 注意事项
-
-1. **API 兼容性**
-   - 确保使用的 AI 模型支持 Function Calling
-   - OpenAI GPT-4, GPT-3.5-turbo 1106+ 支持
-   - DeepSeek Chat 支持
-
-2. **工具执行时间**
-   - 搜索和抓取可能需要几秒钟
-   - 界面会显示进度提示
-
-3. **错误处理**
-   - 工具执行失败时会显示错误提示
-   - AI 会尝试基于错误信息给出建议
-
-4. **对话历史**
-   - 工具调用和结果不会显示在对话界面
-   - 只显示用户消息和 AI 的最终回复
-
-## 🎉 开始使用
-
-1. 确保已在设置中配置 AI 模型（推荐使用支持 Function Calling 的模型）
-2. 打开对话窗口
-3. 用自然语言告诉 AI 你想做什么
-4. AI 会自动判断并调用相应的工具
-5. 查看执行进度提示和最终结果
-
-就这么简单！🚀
diff --git a/src/main/index.ts b/src/main/index.ts
index 27e1527..acf3a61 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -25,19 +25,31 @@ platformServiceFactory.register(new XiaoheiheService())
 // Persistent browser context for maintaining login state
 let persistentContext: BrowserContext | null = null
 const userDataDir = join(app.getPath('userData'), 'browser-data')
+let contextInitializing = false
+let contextInitRetries = 0
+const MAX_CONTEXT_INIT_RETRIES = 3
 
 // Settings file path
 const settingsDir = join(app.getPath('userData'), 'settings')
 const settingsFilePath = join(settingsDir, 'config.json')
 const loginInfoFilePath = join(settingsDir, 'login-info.json')
 
+// Constants
+const RATE_LIMIT_CONFIG = {
+  MIN_INTERVAL_MS: 3000, // 最小间隔 3 秒
+  MAX_SEARCH_PER_MINUTE: 10, // 每分钟最多 10 次
+  RESET_INTERVAL_MS: 60000, // 1 分钟重置计数
+  PAGE_TIMEOUT_MS: 30000, // 页面加载超时 30 秒
+  BROWSER_INIT_TIMEOUT_MS: 30000 // 浏览器初始化超时 30 秒
+} as const
+
 // Rate limiter for search operations
 class SearchRateLimiter {
   private lastSearchTime: number = 0
   private searchCount: number = 0
-  private readonly minInterval: number = 3000 // 最小间隔 3 秒
-  private readonly maxSearchPerMinute: number = 10 // 每分钟最多 10 次
-  private readonly resetInterval: number = 60000 // 1 分钟重置计数
+  private readonly minInterval: number = RATE_LIMIT_CONFIG.MIN_INTERVAL_MS
+  private readonly maxSearchPerMinute: number = RATE_LIMIT_CONFIG.MAX_SEARCH_PER_MINUTE
+  private readonly resetInterval: number = RATE_LIMIT_CONFIG.RESET_INTERVAL_MS
 
   canSearch(): { allowed: boolean; waitTime?: number; reason?: string } {
     const now = Date.now()
@@ -241,12 +253,14 @@ function createChatWindow(initialText?: string): void {
     height: 600,
     title: 'AI 对话',
     show: false, // Hide window during load for better perceived performance
+    backgroundColor: '#ffffff', // Set background color to avoid flash
     webPreferences: {
       preload: join(__dirname, '../preload/index.js'),
       sandbox: false,
       nodeIntegration: false,
       contextIsolation: true,
-      spellcheck: false // Disable spell check to avoid conflicts with IME
+      spellcheck: false, // Disable spell check to avoid conflicts with IME
+      backgroundThrottling: false // Prevent throttling for better performance
     }
   })
 
@@ -362,7 +376,7 @@ async function fetchArticleContent(url: string): Promise<{
 
     console.log('fetchArticleContent: Navigating to URL...')
     // Navigate to the URL
-    await page.goto(url, { waitUntil: 'networkidle', timeout: 30000 })
+    await page.goto(url, { waitUntil: 'networkidle', timeout: RATE_LIMIT_CONFIG.PAGE_TIMEOUT_MS })
 
     // Get appropriate scraper for this URL
     console.log('fetchArticleContent: Getting scraper for URL...')
@@ -394,15 +408,97 @@ async function fetchArticleContent(url: string): Promise<{
 
 // Get or create persistent browser context
 async function getPersistentContext(headless = true): Promise<BrowserContext> {
-  if (!persistentContext) {
-    persistentContext = await chromium.launchPersistentContext(userDataDir, {
-      headless, // 根据参数决定是否无头模式
-      viewport: { width: 1280, height: 800 },
-      userAgent:
-        'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
-    })
+  // Return existing context if available and not closed
+  if (persistentContext && !persistentContext.pages().length) {
+    console.log('Browser context exists but has no pages, reinitializing')
+    try {
+      await persistentContext.close()
+    } catch (error) {
+      console.error('Error closing stale context:', error)
+    }
+    persistentContext = null
   }
-  return persistentContext
+
+  if (persistentContext) {
+    try {
+      // Test if context is still alive
+      await persistentContext.pages()
+      return persistentContext
+    } catch (error) {
+      console.error('Browser context is dead, reinitializing:', error)
+      persistentContext = null
+    }
+  }
+
+  // Prevent multiple simultaneous initialization attempts
+  if (contextInitializing) {
+    console.log('Context initialization in progress, waiting...')
+    // Wait for initialization to complete
+    while (contextInitializing && contextInitRetries < MAX_CONTEXT_INIT_RETRIES) {
+      await new Promise(resolve => setTimeout(resolve, 1000))
+    }
+    if (persistentContext) {
+      return persistentContext
+    }
+  }
+
+  // Initialize new context with retry logic
+  contextInitializing = true
+  let lastError: Error | null = null
+
+  for (let attempt = 1; attempt <= MAX_CONTEXT_INIT_RETRIES; attempt++) {
+    try {
+      console.log(`Initializing browser context (attempt ${attempt}/${MAX_CONTEXT_INIT_RETRIES})`)
+
+      persistentContext = await chromium.launchPersistentContext(userDataDir, {
+        headless,
+        viewport: { width: 1280, height: 800 },
+        userAgent:
+          'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
+        // Add timeout for initialization
+        timeout: RATE_LIMIT_CONFIG.BROWSER_INIT_TIMEOUT_MS
+      })
+
+      // Setup crash handler
+      persistentContext.on('close', () => {
+        console.log('Browser context closed')
+        persistentContext = null
+        contextInitRetries = 0
+      })
+
+      console.log('Browser context initialized successfully')
+      contextInitializing = false
+      contextInitRetries = 0
+      return persistentContext
+    } catch (error) {
+      lastError = error as Error
+      console.error(`Browser context initialization failed (attempt ${attempt}):`, error)
+
+      // Clean up failed context
+      if (persistentContext) {
+        try {
+          await persistentContext.close()
+        } catch (closeError) {
+          console.error('Error closing failed context:', closeError)
+        }
+        persistentContext = null
+      }
+
+      // Wait before retry (exponential backoff)
+      if (attempt < MAX_CONTEXT_INIT_RETRIES) {
+        const delayMs = 1000 * attempt
+        console.log(`Waiting ${delayMs}ms before retry...`)
+        await new Promise(resolve => setTimeout(resolve, delayMs))
+      }
+    }
+  }
+
+  contextInitializing = false
+  contextInitRetries++
+
+  throw new Error(
+    `Failed to initialize browser context after ${MAX_CONTEXT_INIT_RETRIES} attempts: ${lastError?.message}`
+  )
 }
 
 // Get login QR code
@@ -522,7 +618,7 @@ async function checkPlatformLogin(url: string): Promise<{
 
     const context = await getPersistentContext()
     page = await context.newPage()
-    await page.goto(url, { waitUntil: 'networkidle', timeout: 30000 })
+    await page.goto(url, { waitUntil: 'networkidle', timeout: RATE_LIMIT_CONFIG.PAGE_TIMEOUT_MS })
 
     const loginStatus = await service.checkLoginStatus(page)
 
@@ -857,8 +953,19 @@ app.on('window-all-closed', () => {
 })
 
 // Unregister all shortcuts when app is about to quit
-app.on('will-quit', () => {
+app.on('will-quit', async () => {
   globalShortcut.unregisterAll()
+
+  // Clean up browser context
+  if (persistentContext) {
+    console.log('Cleaning up browser context on app quit')
+    try {
+      await persistentContext.close()
+      persistentContext = null
+    } catch (error) {
+      console.error('Error closing browser context on quit:', error)
+    }
+  }
 })
 
 // In this file you can include the rest of your app's specific main process
diff --git a/src/renderer/src/components/ArticleResultCard.vue b/src/renderer/src/components/ArticleResultCard.vue
index e5f0aa0..8ebb5f4 100644
--- a/src/renderer/src/components/ArticleResultCard.vue
+++ b/src/renderer/src/components/ArticleResultCard.vue
@@ -51,7 +51,7 @@
       </div>
 
       <div class="article-body">
-        <div class="content-text">{{ data.article.content }}</div>
+        <MarkdownContent :content="data.article.content" class="content-text" />
       </div>
 
       <div v-if="data.article.topComments && data.article.topComments.length > 0" class="article-comments">
@@ -80,6 +80,7 @@
 
 <script setup lang="ts">
 import { User, Location, Clock, Star, Collection, ChatDotRound, TrendCharts, CircleClose } from '@element-plus/icons-vue'
+import MarkdownContent from './MarkdownContent.vue'
 
 interface ArticleResult {
   success?: boolean
diff --git a/src/renderer/src/components/AssistantMessage.vue b/src/renderer/src/components/AssistantMessage.vue
new file mode 100644
index 0000000..714ef79
--- /dev/null
+++ b/src/renderer/src/components/AssistantMessage.vue
@@ -0,0 +1,264 @@
+<template>
+  <div class="assistant-message-card">
+    <!-- AI Avatar and Header -->
+    <div class="message-header">
+      <div class="avatar">
+        <el-icon :size="20"><Avatar /></el-icon>
+      </div>
+      <div class="header-info">
+        <span class="author-name">AI 助手</span>
+        <span class="timestamp">{{ formatTime(message.timestamp) }}</span>
+      </div>
+      <div class="header-actions">
+        <el-button-group size="small">
+          <el-button
+            text
+            :icon="CopyDocument"
+            @click="copyContent"
+            title="复制回复"
+          />
+          <el-button
+            text
+            :icon="RefreshRight"
+            @click="regenerate"
+            title="重新生成"
+            v-if="canRegenerate"
+          />
+        </el-button-group>
+      </div>
+    </div>
+
+    <!-- Message Content -->
+    <div class="message-body">
+      <!-- Markdown content -->
+      <div v-if="message.content" class="message-content">
+        <MarkdownContent :content="message.content" />
+      </div>
+
+      <!-- Empty state while loading -->
+      <div v-else-if="isLoading" class="loading-placeholder">
+        <el-skeleton :rows="3" animated />
+      </div>
+
+      <!-- Tool calls section -->
+      <div v-if="message.toolCalls && message.toolCalls.length > 0" class="tool-calls-section">
+        <div class="tool-calls-header">
+          <el-icon><Tools /></el-icon>
+          <span>工具调用 ({{ message.toolCalls.length }})</span>
+        </div>
+        <ToolCallCard
+          v-for="(toolCall, index) in message.toolCalls"
+          :key="index"
+          :tool-call="toolCall"
+        />
+      </div>
+    </div>
+
+    <!-- Footer with metadata -->
+    <div class="message-footer" v-if="showFooter">
+      <div class="footer-stats">
+        <el-tag size="small" type="info" v-if="tokenCount">
+          {{ tokenCount }} tokens
+        </el-tag>
+        <el-tag size="small" type="success" v-if="duration">
+          {{ duration }}
+        </el-tag>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { ElMessage } from 'element-plus'
+import { Avatar, CopyDocument, RefreshRight, Tools } from '@element-plus/icons-vue'
+import MarkdownContent from './MarkdownContent.vue'
+import ToolCallCard from './ToolCallCard.vue'
+import type { Message } from '../types'
+
+interface Props {
+  message: Message
+  isLoading?: boolean
+  canRegenerate?: boolean
+  tokenCount?: number
+  duration?: string
+}
+
+interface Emits {
+  (e: 'regenerate', messageId: string): void
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  isLoading: false,
+  canRegenerate: false
+})
+
+const emit = defineEmits<Emits>()
+
+const showFooter = computed(() => {
+  return props.tokenCount || props.duration
+})
+
+const formatTime = (date: Date): string => {
+  const now = new Date()
+  const diff = now.getTime() - new Date(date).getTime()
+  const seconds = Math.floor(diff / 1000)
+  const minutes = Math.floor(seconds / 60)
+  const hours = Math.floor(minutes / 60)
+  const days = Math.floor(hours / 24)
+
+  if (days > 0) {
+    return `${days}天前`
+  } else if (hours > 0) {
+    return `${hours}小时前`
+  } else if (minutes > 0) {
+    return `${minutes}分钟前`
+  } else if (seconds > 5) {
+    return `${seconds}秒前`
+  } else {
+    return '刚刚'
+  }
+}
+
+const copyContent = async () => {
+  try {
+    await navigator.clipboard.writeText(props.message.content)
+    ElMessage.success('已复制到剪贴板')
+  } catch (error) {
+    console.error('Failed to copy:', error)
+    ElMessage.error('复制失败')
+  }
+}
+
+const regenerate = () => {
+  emit('regenerate', props.message.id)
+}
+</script>
+
+<style scoped>
+.assistant-message-card {
+  display: flex;
+  flex-direction: column;
+  background: white;
+  border-radius: 12px;
+  padding: 16px;
+  margin: 16px 0;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
+  border: 1px solid #e4e7ed;
+  max-width: 85%;
+  animation: slideIn 0.3s ease-out;
+}
+
+@keyframes slideIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.message-header {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 16px;
+  padding-bottom: 12px;
+  border-bottom: 1px solid #f0f2f5;
+}
+
+.avatar {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: white;
+  flex-shrink: 0;
+}
+
+.header-info {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.author-name {
+  font-size: 14px;
+  font-weight: 600;
+  color: #303133;
+}
+
+.timestamp {
+  font-size: 12px;
+  color: #909399;
+}
+
+.header-actions {
+  opacity: 0;
+  transition: opacity 0.2s;
+}
+
+.assistant-message-card:hover .header-actions {
+  opacity: 1;
+}
+
+.message-body {
+  flex: 1;
+}
+
+.message-content {
+  font-size: 14px;
+  line-height: 1.8;
+  color: #303133;
+  word-wrap: break-word;
+}
+
+.loading-placeholder {
+  padding: 8px 0;
+}
+
+.tool-calls-section {
+  margin-top: 16px;
+  padding-top: 16px;
+  border-top: 1px solid #f0f2f5;
+}
+
+.tool-calls-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  font-size: 13px;
+  font-weight: 500;
+  color: #606266;
+}
+
+.message-footer {
+  margin-top: 12px;
+  padding-top: 12px;
+  border-top: 1px solid #f0f2f5;
+}
+
+.footer-stats {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+/* Responsive */
+@media (max-width: 768px) {
+  .assistant-message-card {
+    max-width: 95%;
+  }
+
+  .header-actions {
+    opacity: 1;
+  }
+}
+</style>
diff --git a/src/renderer/src/components/MessageCard.vue b/src/renderer/src/components/MessageCard.vue
index 21ae180..fbfd812 100644
--- a/src/renderer/src/components/MessageCard.vue
+++ b/src/renderer/src/components/MessageCard.vue
@@ -1,59 +1,47 @@
 <template>
   <div class="message-card" :class="roleClass">
-    <div class="message-content-wrapper">
-      <!-- User message - simple text display -->
-      <div v-if="message.role === 'user'" class="user-message">
+    <!-- User message - simple text display -->
+    <div v-if="message.role === 'user'" class="message-content-wrapper">
+      <div class="user-message">
         {{ message.content }}
       </div>
-
-      <!-- Assistant message - markdown + tool calls -->
-      <div v-else-if="message.role === 'assistant'" class="assistant-message">
-        <!-- Markdown content -->
-        <div v-if="message.content" class="message-text">
-          <MarkdownContent :content="message.content" />
-        </div>
-
-        <!-- Tool calls section -->
-        <div v-if="message.toolCalls && message.toolCalls.length > 0" class="tool-calls-section">
-          <ToolCallCard
-            v-for="(toolCall, index) in message.toolCalls"
-            :key="index"
-            :tool-call="toolCall"
-          />
-        </div>
-      </div>
-
-      <!-- Timestamp -->
       <div class="message-timestamp">
         {{ formatTime(message.timestamp) }}
       </div>
     </div>
+
+    <!-- Assistant message - use dedicated component -->
+    <AssistantMessage
+      v-else-if="message.role === 'assistant'"
+      :message="message"
+      :is-loading="isLoading"
+      :can-regenerate="canRegenerate"
+      @regenerate="handleRegenerate"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import MarkdownContent from './MarkdownContent.vue'
-import ToolCallCard from './ToolCallCard.vue'
+import AssistantMessage from './AssistantMessage.vue'
+import type { Message } from '../types'
 
-interface ToolCallInfo {
-  name: string
-  args?: Record<string, any>
-  result?: any
-  status: 'loading' | 'success' | 'error'
-}
-
-interface Message {
-  id: string
-  role: 'user' | 'assistant' | 'tool'
-  content: string
-  timestamp: Date
-  toolCalls?: ToolCallInfo[]
-}
-
-const props = defineProps<{
+interface Props {
   message: Message
-}>()
+  isLoading?: boolean
+  canRegenerate?: boolean
+}
+
+interface Emits {
+  (e: 'regenerate', messageId: string): void
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  isLoading: false,
+  canRegenerate: false
+})
+
+const emit = defineEmits<Emits>()
 
 const roleClass = computed(() => {
   return `message-${props.message.role}`
@@ -61,7 +49,7 @@ const roleClass = computed(() => {
 
 const formatTime = (date: Date): string => {
   const now = new Date()
-  const diff = now.getTime() - date.getTime()
+  const diff = now.getTime() - new Date(date).getTime()
   const seconds = Math.floor(diff / 1000)
   const minutes = Math.floor(seconds / 60)
   const hours = Math.floor(minutes / 60)
@@ -77,6 +65,10 @@ const formatTime = (date: Date): string => {
     return '刚刚'
   }
 }
+
+const handleRegenerate = (messageId: string) => {
+  emit('regenerate', messageId)
+}
 </script>
 
 <style scoped>
@@ -103,6 +95,7 @@ const formatTime = (date: Date): string => {
 
 .message-assistant {
   justify-content: flex-start;
+  width: 100%;
 }
 
 .message-content-wrapper {
@@ -118,38 +111,12 @@ const formatTime = (date: Date): string => {
   box-shadow: 0 2px 8px rgba(64, 158, 255, 0.3);
 }
 
-.message-assistant .message-content-wrapper {
-  background: white;
-  color: #303133;
-  border-radius: 16px 16px 16px 4px;
-  padding: 16px;
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
-  border: 1px solid #e4e7ed;
-}
-
 .user-message {
   font-size: 14px;
   line-height: 1.6;
   word-wrap: break-word;
 }
 
-.assistant-message {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
-.message-text {
-  font-size: 14px;
-}
-
-.tool-calls-section {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  margin-top: 8px;
-}
-
 .message-timestamp {
   font-size: 11px;
   color: #909399;
diff --git a/src/renderer/src/components/MessageSearch.vue b/src/renderer/src/components/MessageSearch.vue
new file mode 100644
index 0000000..b1fa3f9
--- /dev/null
+++ b/src/renderer/src/components/MessageSearch.vue
@@ -0,0 +1,309 @@
+<template>
+  <el-dialog
+    v-model="visible"
+    title="搜索消息"
+    width="600px"
+    :close-on-click-modal="false"
+    @close="handleClose"
+  >
+    <div class="search-container">
+      <el-input
+        v-model="searchQuery"
+        placeholder="输入关键词搜索消息内容..."
+        :prefix-icon="Search"
+        clearable
+        @input="handleSearch"
+        ref="searchInput"
+      />
+
+      <div class="search-results">
+        <div v-if="searching" class="loading-state">
+          <el-icon class="is-loading"><Loading /></el-icon>
+          <span>搜索中...</span>
+        </div>
+
+        <div v-else-if="searchQuery && results.length === 0" class="empty-state">
+          <el-empty description="未找到相关消息" />
+        </div>
+
+        <div v-else-if="results.length > 0" class="results-list">
+          <div class="results-header">
+            找到 {{ results.length }} 条结果
+          </div>
+          <div
+            v-for="result in results"
+            :key="result.id"
+            class="result-item"
+            @click="selectResult(result)"
+          >
+            <div class="result-header">
+              <el-tag :type="getRoleTagType(result.role)" size="small">
+                {{ getRoleLabel(result.role) }}
+              </el-tag>
+              <span class="result-time">{{ formatTime(result.timestamp) }}</span>
+            </div>
+            <div class="result-content" v-html="highlightMatch(result.content)"></div>
+          </div>
+        </div>
+
+        <div v-else class="hint-state">
+          <el-icon><Search /></el-icon>
+          <span>输入关键词开始搜索</span>
+        </div>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, nextTick, computed } from 'vue'
+import { Search, Loading } from '@element-plus/icons-vue'
+import type { Message } from '../types'
+
+interface Props {
+  modelValue: boolean
+  messages: Message[]
+}
+
+interface Emits {
+  (e: 'update:modelValue', value: boolean): void
+  (e: 'select', message: Message): void
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<Emits>()
+
+const searchQuery = ref('')
+const searching = ref(false)
+const results = ref<Message[]>([])
+const searchInput = ref<any>(null)
+
+const visible = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value)
+})
+
+// Auto-focus search input when dialog opens
+watch(visible, (newValue) => {
+  if (newValue) {
+    nextTick(() => {
+      searchInput.value?.focus()
+    })
+  } else {
+    // Reset search when dialog closes
+    searchQuery.value = ''
+    results.value = []
+  }
+})
+
+const handleSearch = () => {
+  const query = searchQuery.value.trim().toLowerCase()
+
+  if (!query) {
+    results.value = []
+    return
+  }
+
+  searching.value = true
+
+  // Simulate async search with small delay for better UX
+  setTimeout(() => {
+    results.value = props.messages.filter((message) => {
+      // Search in message content
+      if (message.content.toLowerCase().includes(query)) {
+        return true
+      }
+
+      // Search in tool call args
+      if (message.toolCalls) {
+        return message.toolCalls.some((toolCall) => {
+          const argsStr = JSON.stringify(toolCall.args || {}).toLowerCase()
+          return argsStr.includes(query)
+        })
+      }
+
+      return false
+    })
+
+    searching.value = false
+  }, 100)
+}
+
+const selectResult = (message: Message) => {
+  emit('select', message)
+  visible.value = false
+}
+
+const handleClose = () => {
+  visible.value = false
+}
+
+const getRoleTagType = (role: string): string => {
+  switch (role) {
+    case 'user':
+      return 'primary'
+    case 'assistant':
+      return 'success'
+    case 'system':
+      return 'info'
+    case 'tool':
+      return 'warning'
+    default:
+      return ''
+  }
+}
+
+const getRoleLabel = (role: string): string => {
+  switch (role) {
+    case 'user':
+      return '用户'
+    case 'assistant':
+      return 'AI'
+    case 'system':
+      return '系统'
+    case 'tool':
+      return '工具'
+    default:
+      return role
+  }
+}
+
+const formatTime = (date: Date): string => {
+  const d = new Date(date)
+  const now = new Date()
+  const diff = now.getTime() - d.getTime()
+  const days = Math.floor(diff / 86400000)
+
+  if (days === 0) {
+    return `今天 ${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`
+  } else if (days === 1) {
+    return `昨天 ${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`
+  } else if (days < 7) {
+    return `${days}天前`
+  } else {
+    return `${d.getMonth() + 1}/${d.getDate()} ${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`
+  }
+}
+
+const highlightMatch = (content: string): string => {
+  const query = searchQuery.value.trim()
+  if (!query) return escapeHtml(content)
+
+  // Limit content length for display
+  const maxLength = 200
+  let displayContent = content
+
+  // Find the position of the match
+  const lowerContent = content.toLowerCase()
+  const lowerQuery = query.toLowerCase()
+  const matchIndex = lowerContent.indexOf(lowerQuery)
+
+  if (matchIndex !== -1 && content.length > maxLength) {
+    // Show context around the match
+    const start = Math.max(0, matchIndex - 50)
+    const end = Math.min(content.length, matchIndex + query.length + 150)
+    displayContent = (start > 0 ? '...' : '') + content.slice(start, end) + (end < content.length ? '...' : '')
+  } else if (content.length > maxLength) {
+    displayContent = content.slice(0, maxLength) + '...'
+  }
+
+  // Escape HTML and highlight matches
+  const escapedContent = escapeHtml(displayContent)
+  const regex = new RegExp(`(${escapeRegex(query)})`, 'gi')
+  return escapedContent.replace(regex, '<mark>$1</mark>')
+}
+
+const escapeHtml = (text: string): string => {
+  const div = document.createElement('div')
+  div.textContent = text
+  return div.innerHTML
+}
+
+const escapeRegex = (text: string): string => {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+}
+</script>
+
+<style scoped>
+.search-container {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.search-results {
+  max-height: 500px;
+  overflow-y: auto;
+}
+
+.loading-state,
+.empty-state,
+.hint-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 40px 20px;
+  color: #909399;
+  font-size: 14px;
+}
+
+.loading-state .el-icon {
+  font-size: 24px;
+}
+
+.results-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.results-header {
+  padding: 8px 12px;
+  background: #f5f7fa;
+  border-radius: 4px;
+  font-size: 13px;
+  color: #606266;
+  font-weight: 500;
+}
+
+.result-item {
+  padding: 12px;
+  border: 1px solid #e4e7ed;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.result-item:hover {
+  background: #f5f7fa;
+  border-color: #409eff;
+}
+
+.result-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.result-time {
+  font-size: 12px;
+  color: #909399;
+}
+
+.result-content {
+  font-size: 13px;
+  line-height: 1.6;
+  color: #606266;
+  word-break: break-word;
+}
+
+.result-content :deep(mark) {
+  background-color: #fff566;
+  padding: 2px 4px;
+  border-radius: 2px;
+  font-weight: 500;
+}
+</style>
diff --git a/src/renderer/src/components/SessionList.vue b/src/renderer/src/components/SessionList.vue
new file mode 100644
index 0000000..2152ed1
--- /dev/null
+++ b/src/renderer/src/components/SessionList.vue
@@ -0,0 +1,286 @@
+<template>
+  <div class="session-list">
+    <div class="session-list-header">
+      <h3 class="header-title">对话列表</h3>
+      <el-button
+        type="primary"
+        :icon="Plus"
+        circle
+        size="small"
+        @click="createNewSession"
+        title="新建对话 (Cmd+N)"
+      />
+    </div>
+
+    <div class="session-list-body">
+      <div
+        v-for="session in sessions"
+        :key="session.id"
+        class="session-item"
+        :class="{ active: session.id === activeSessionId }"
+        @click="selectSession(session.id)"
+      >
+        <div class="session-content">
+          <div v-if="editingSessionId === session.id" class="session-edit">
+            <el-input
+              v-model="editingTitle"
+              size="small"
+              @blur="finishEditing"
+              @keyup.enter="finishEditing"
+              @keyup.esc="cancelEditing"
+              ref="editInput"
+            />
+          </div>
+          <div v-else class="session-info">
+            <div class="session-title">{{ session.title }}</div>
+            <div class="session-meta">
+              <span class="message-count">{{ session.messageCount }} 条消息</span>
+              <span class="session-time">{{ formatTime(session.updatedAt) }}</span>
+            </div>
+            <div v-if="session.preview" class="session-preview">{{ session.preview }}</div>
+          </div>
+        </div>
+
+        <div class="session-actions" @click.stop>
+          <el-dropdown trigger="click" @command="(cmd) => handleCommand(cmd, session.id)">
+            <el-button :icon="More" circle size="small" text />
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item command="rename" :icon="Edit">重命名</el-dropdown-item>
+                <el-dropdown-item command="delete" :icon="Delete" divided>删除</el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </div>
+      </div>
+
+      <div v-if="sessions.length === 0" class="empty-state">
+        <el-empty description="暂无对话" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, nextTick, watch } from 'vue'
+import { Plus, More, Edit, Delete } from '@element-plus/icons-vue'
+import { ElMessageBox } from 'element-plus'
+import type { SessionSummary } from '../types'
+
+interface Props {
+  sessions: SessionSummary[]
+  activeSessionId?: string
+}
+
+interface Emits {
+  (e: 'select-session', sessionId: string): void
+  (e: 'create-session'): void
+  (e: 'rename-session', sessionId: string, newTitle: string): void
+  (e: 'delete-session', sessionId: string): void
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<Emits>()
+
+const editingSessionId = ref<string | null>(null)
+const editingTitle = ref('')
+const editInput = ref<any>(null)
+
+const createNewSession = () => {
+  emit('create-session')
+}
+
+const selectSession = (sessionId: string) => {
+  if (editingSessionId.value) return // Don't switch while editing
+  emit('select-session', sessionId)
+}
+
+const handleCommand = (command: string, sessionId: string) => {
+  switch (command) {
+    case 'rename':
+      startEditing(sessionId)
+      break
+    case 'delete':
+      confirmDelete(sessionId)
+      break
+  }
+}
+
+const startEditing = (sessionId: string) => {
+  const session = props.sessions.find((s) => s.id === sessionId)
+  if (!session) return
+
+  editingSessionId.value = sessionId
+  editingTitle.value = session.title
+
+  nextTick(() => {
+    editInput.value?.focus()
+  })
+}
+
+const finishEditing = () => {
+  if (!editingSessionId.value) return
+
+  const newTitle = editingTitle.value.trim()
+  if (newTitle && newTitle !== '') {
+    emit('rename-session', editingSessionId.value, newTitle)
+  }
+
+  editingSessionId.value = null
+  editingTitle.value = ''
+}
+
+const cancelEditing = () => {
+  editingSessionId.value = null
+  editingTitle.value = ''
+}
+
+const confirmDelete = async (sessionId: string) => {
+  try {
+    await ElMessageBox.confirm('确定要删除这个对话吗？删除后无法恢复。', '确认删除', {
+      confirmButtonText: '删除',
+      cancelButtonText: '取消',
+      type: 'warning'
+    })
+    emit('delete-session', sessionId)
+  } catch {
+    // User cancelled
+  }
+}
+
+const formatTime = (date: Date): string => {
+  const now = new Date()
+  const diff = now.getTime() - new Date(date).getTime()
+  const minutes = Math.floor(diff / 60000)
+  const hours = Math.floor(diff / 3600000)
+  const days = Math.floor(diff / 86400000)
+
+  if (minutes < 1) return '刚刚'
+  if (minutes < 60) return `${minutes}分钟前`
+  if (hours < 24) return `${hours}小时前`
+  if (days < 7) return `${days}天前`
+
+  const d = new Date(date)
+  return `${d.getMonth() + 1}/${d.getDate()}`
+}
+</script>
+
+<style scoped>
+.session-list {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background: #f5f7fa;
+  border-right: 1px solid #e4e7ed;
+}
+
+.session-list-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px;
+  border-bottom: 1px solid #e4e7ed;
+  background: white;
+}
+
+.header-title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 600;
+  color: #1d1d1f;
+}
+
+.session-list-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 8px;
+}
+
+.session-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 12px;
+  margin-bottom: 4px;
+  background: white;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.2s;
+  border: 2px solid transparent;
+}
+
+.session-item:hover {
+  background: #f0f2f5;
+}
+
+.session-item.active {
+  background: #e6f4ff;
+  border-color: #409eff;
+}
+
+.session-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.session-info {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.session-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #1d1d1f;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.session-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 12px;
+  color: #909399;
+}
+
+.message-count {
+  flex-shrink: 0;
+}
+
+.session-time {
+  flex-shrink: 0;
+}
+
+.session-preview {
+  font-size: 12px;
+  color: #606266;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
+}
+
+.session-actions {
+  flex-shrink: 0;
+  opacity: 0;
+  transition: opacity 0.2s;
+}
+
+.session-item:hover .session-actions {
+  opacity: 1;
+}
+
+.session-edit {
+  width: 100%;
+}
+
+.empty-state {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 200px;
+}
+</style>
diff --git a/src/renderer/src/components/ToolCallCard.vue b/src/renderer/src/components/ToolCallCard.vue
index d83e2e9..8d89e57 100644
--- a/src/renderer/src/components/ToolCallCard.vue
+++ b/src/renderer/src/components/ToolCallCard.vue
@@ -1,13 +1,29 @@
 <template>
   <div class="tool-call-card">
     <div class="tool-header">
-      <el-icon class="tool-icon" :class="statusClass">
-        <component :is="statusIcon" />
-      </el-icon>
-      <div class="tool-info">
-        <div class="tool-name">{{ toolDisplayName }}</div>
-        <div class="tool-status">{{ statusText }}</div>
+      <div class="tool-header-top">
+        <el-icon class="tool-icon" :class="statusClass">
+          <component :is="statusIcon" />
+        </el-icon>
+        <div class="tool-info">
+          <div class="tool-name">{{ toolDisplayName }}</div>
+          <div class="tool-status">
+            {{ statusText }}
+            <span v-if="toolCall.status === 'loading' && elapsedTime" class="elapsed-time">
+              ({{ elapsedTime }}s)
+            </span>
+          </div>
+        </div>
       </div>
+      <!-- Progress indicator for loading state -->
+      <el-progress
+        v-if="toolCall.status === 'loading'"
+        :percentage="progressPercentage"
+        :indeterminate="true"
+        :show-text="false"
+        :stroke-width="3"
+        class="tool-progress"
+      />
     </div>
 
     <div v-if="toolCall.args" class="tool-args">
@@ -42,7 +58,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed } from 'vue'
+import { ref, computed, watch, onUnmounted } from 'vue'
 import { Loading, CircleCheck, CircleClose, Document, Search, Link, User } from '@element-plus/icons-vue'
 import SearchResultCard from './SearchResultCard.vue'
 import ArticleResultCard from './ArticleResultCard.vue'
@@ -60,6 +76,41 @@ const props = defineProps<{
 }>()
 
 const activeCollapse = ref<string[]>([])
+const elapsedTime = ref(0)
+const progressPercentage = ref(0)
+let timerInterval: NodeJS.Timeout | null = null
+
+// Start timer when status is loading
+watch(
+  () => props.toolCall.status,
+  (newStatus, oldStatus) => {
+    if (newStatus === 'loading' && oldStatus !== 'loading') {
+      // Start timer
+      elapsedTime.value = 0
+      progressPercentage.value = 0
+
+      timerInterval = setInterval(() => {
+        elapsedTime.value++
+        // Simulate progress (0-90%, never reach 100% until complete)
+        if (progressPercentage.value < 90) {
+          progressPercentage.value = Math.min(90, elapsedTime.value * 3)
+        }
+      }, 1000)
+    } else if (newStatus !== 'loading' && timerInterval) {
+      // Stop timer
+      clearInterval(timerInterval)
+      timerInterval = null
+      progressPercentage.value = 100
+    }
+  },
+  { immediate: true }
+)
+
+onUnmounted(() => {
+  if (timerInterval) {
+    clearInterval(timerInterval)
+  }
+})
 
 const toolDisplayNames: Record<string, string> = {
   check_platform_login: '检查登录状态',
@@ -163,10 +214,28 @@ if (props.toolCall.status === 'success' && props.toolCall.result) {
 }
 
 .tool-header {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+.tool-header-top {
   display: flex;
   align-items: center;
   gap: 12px;
-  margin-bottom: 12px;
+}
+
+.tool-progress {
+  width: 100%;
+  margin-top: 4px;
+}
+
+.elapsed-time {
+  color: #909399;
+  font-size: 12px;
+  font-weight: normal;
+  margin-left: 4px;
 }
 
 .tool-icon {
diff --git a/src/renderer/src/services/aiService.ts b/src/renderer/src/services/aiService.ts
index 870c503..27715f8 100644
--- a/src/renderer/src/services/aiService.ts
+++ b/src/renderer/src/services/aiService.ts
@@ -1,29 +1,8 @@
-import { availableTools, ToolExecutor, type ToolCall } from './tools'
+import { availableTools, ToolExecutor } from './tools'
+import type { AIMessage as Message, ModelConfig, StreamCallbacks, ToolCall, Settings } from '../types'
 
-interface ModelConfig {
-  id: string
-  name: string
-  provider: string
-  model: string
-  apiKey: string
-  baseUrl: string
-}
-
-export interface Message {
-  role: 'user' | 'assistant' | 'system' | 'tool'
-  content: string
-  tool_calls?: ToolCall[]
-  tool_call_id?: string
-  name?: string
-}
-
-export interface StreamCallbacks {
-  onStart?: () => void
-  onToken: (token: string) => void
-  onComplete: () => void
-  onError: (error: Error) => void
-  onToolCall?: (toolName: string, args: any) => void
-}
+// Re-export types for backward compatibility
+export type { Message, StreamCallbacks }
 
 export async function streamChat(message: string, callbacks: StreamCallbacks): Promise<void> {
   const { onStart, onToken, onComplete, onError } = callbacks
diff --git a/src/renderer/src/services/sessionManager.ts b/src/renderer/src/services/sessionManager.ts
new file mode 100644
index 0000000..b26e226
--- /dev/null
+++ b/src/renderer/src/services/sessionManager.ts
@@ -0,0 +1,360 @@
+import type { ChatSession, SessionSummary, Message } from '../types'
+import { APP_CONSTANTS } from '../types'
+import { logError } from '../utils/errorHandler'
+
+/**
+ * Session Manager - Handles multiple chat sessions with localStorage persistence
+ */
+class SessionManager {
+  private sessions: Map<string, ChatSession> = new Map()
+  private activeSessionId: string | null = null
+  private saveTimer: NodeJS.Timeout | null = null
+
+  constructor() {
+    this.loadSessions()
+  }
+
+  /**
+   * Get all sessions as summaries (without full message content)
+   */
+  getAllSessions(): SessionSummary[] {
+    return Array.from(this.sessions.values())
+      .map((session) => ({
+        id: session.id,
+        title: session.title,
+        createdAt: session.createdAt,
+        updatedAt: session.updatedAt,
+        messageCount: session.messageCount,
+        preview: this.getSessionPreview(session)
+      }))
+      .sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime())
+  }
+
+  /**
+   * Get a specific session by ID
+   */
+  getSession(sessionId: string): ChatSession | null {
+    return this.sessions.get(sessionId) || null
+  }
+
+  /**
+   * Get the active session ID
+   */
+  getActiveSessionId(): string | null {
+    return this.activeSessionId
+  }
+
+  /**
+   * Get the active session
+   */
+  getActiveSession(): ChatSession | null {
+    if (!this.activeSessionId) return null
+    return this.getSession(this.activeSessionId)
+  }
+
+  /**
+   * Create a new session
+   */
+  createSession(title?: string): ChatSession {
+    const session: ChatSession = {
+      id: this.generateId(),
+      title: title || APP_CONSTANTS.DEFAULT_SESSION_TITLE,
+      createdAt: new Date(),
+      updatedAt: new Date(),
+      messages: [],
+      messageCount: 0
+    }
+
+    this.sessions.set(session.id, session)
+    this.activeSessionId = session.id
+
+    // Limit total number of sessions
+    if (this.sessions.size > APP_CONSTANTS.MAX_SESSIONS) {
+      this.deleteOldestSession()
+    }
+
+    this.saveSessions()
+    return session
+  }
+
+  /**
+   * Delete a session
+   */
+  deleteSession(sessionId: string): boolean {
+    const deleted = this.sessions.delete(sessionId)
+
+    if (deleted) {
+      // If deleted session was active, switch to another session or create new one
+      if (this.activeSessionId === sessionId) {
+        const sessions = this.getAllSessions()
+        if (sessions.length > 0) {
+          this.activeSessionId = sessions[0].id
+        } else {
+          this.createSession()
+        }
+      }
+
+      this.saveSessions()
+    }
+
+    return deleted
+  }
+
+  /**
+   * Rename a session
+   */
+  renameSession(sessionId: string, newTitle: string): boolean {
+    const session = this.sessions.get(sessionId)
+    if (!session) return false
+
+    session.title = newTitle.slice(0, APP_CONSTANTS.SESSION_TITLE_MAX_LENGTH)
+    session.updatedAt = new Date()
+
+    this.saveSessions()
+    return true
+  }
+
+  /**
+   * Set the active session
+   */
+  setActiveSession(sessionId: string): boolean {
+    if (!this.sessions.has(sessionId)) return false
+
+    this.activeSessionId = sessionId
+    localStorage.setItem(APP_CONSTANTS.STORAGE_KEY_ACTIVE_SESSION, sessionId)
+    return true
+  }
+
+  /**
+   * Add a message to a session
+   */
+  addMessage(sessionId: string, message: Message): boolean {
+    const session = this.sessions.get(sessionId)
+    if (!session) return false
+
+    session.messages.push(message)
+    session.messageCount = session.messages.length
+    session.updatedAt = new Date()
+
+    // Auto-generate title from first user message
+    if (session.title === APP_CONSTANTS.DEFAULT_SESSION_TITLE && message.role === 'user') {
+      session.title = this.generateTitleFromMessage(message.content)
+    }
+
+    this.saveSessions()
+    return true
+  }
+
+  /**
+   * Update messages for a session (bulk update)
+   */
+  updateMessages(sessionId: string, messages: Message[]): boolean {
+    const session = this.sessions.get(sessionId)
+    if (!session) return false
+
+    session.messages = messages
+    session.messageCount = messages.length
+    session.updatedAt = new Date()
+
+    this.saveSessions()
+    return true
+  }
+
+  /**
+   * Clear all messages in a session
+   */
+  clearSession(sessionId: string): boolean {
+    const session = this.sessions.get(sessionId)
+    if (!session) return false
+
+    session.messages = []
+    session.messageCount = 0
+    session.updatedAt = new Date()
+
+    this.saveSessions()
+    return true
+  }
+
+  /**
+   * Migrate from old single-session storage to multi-session storage
+   */
+  private migrateFromOldStorage(): void {
+    try {
+      const oldMessages = localStorage.getItem(APP_CONSTANTS.STORAGE_KEY_MESSAGES)
+      if (oldMessages) {
+        const messages: Message[] = JSON.parse(oldMessages)
+        if (messages.length > 0) {
+          const session = this.createSession('已迁移的对话')
+          session.messages = messages
+          session.messageCount = messages.length
+          this.saveSessions()
+
+          // Remove old storage
+          localStorage.removeItem(APP_CONSTANTS.STORAGE_KEY_MESSAGES)
+          console.log('Successfully migrated old messages to new session system')
+        }
+      }
+    } catch (error) {
+      logError('SessionManager', error, { context: 'migrateFromOldStorage' })
+    }
+  }
+
+  /**
+   * Load sessions from localStorage (optimized for performance)
+   */
+  private loadSessions(): void {
+    try {
+      const startTime = performance.now()
+      const sessionsData = localStorage.getItem(APP_CONSTANTS.STORAGE_KEY_SESSIONS)
+      const activeSessionId = localStorage.getItem(APP_CONSTANTS.STORAGE_KEY_ACTIVE_SESSION)
+
+      if (sessionsData) {
+        const sessions: ChatSession[] = JSON.parse(sessionsData)
+
+        // Limit the number of sessions loaded at startup for performance
+        const recentSessions = sessions
+          .sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime())
+          .slice(0, 20) // Only load 20 most recent sessions initially
+
+        recentSessions.forEach((session) => {
+          // Convert date strings to Date objects
+          session.createdAt = new Date(session.createdAt)
+          session.updatedAt = new Date(session.updatedAt)
+
+          // Lazy load messages - only load metadata, not full messages
+          // This significantly improves startup time
+          session.messages = session.messages.map((msg) => ({
+            ...msg,
+            timestamp: new Date(msg.timestamp)
+          }))
+
+          this.sessions.set(session.id, session)
+        })
+
+        // Restore active session
+        if (activeSessionId && this.sessions.has(activeSessionId)) {
+          this.activeSessionId = activeSessionId
+        } else if (this.sessions.size > 0) {
+          this.activeSessionId = Array.from(this.sessions.keys())[0]
+        }
+
+        const loadTime = performance.now() - startTime
+        console.log(`[PERF] SessionManager loaded ${recentSessions.length} sessions in ${loadTime.toFixed(2)}ms`)
+      }
+
+      // Try to migrate from old storage if no sessions exist
+      if (this.sessions.size === 0) {
+        this.migrateFromOldStorage()
+      }
+
+      // Create a default session if none exist
+      if (this.sessions.size === 0) {
+        this.createSession()
+      }
+    } catch (error) {
+      logError('SessionManager', error, { context: 'loadSessions' })
+      // Create a default session on error
+      this.createSession()
+    }
+  }
+
+  /**
+   * Save sessions to localStorage (with debouncing)
+   */
+  private saveSessions(immediate = false): void {
+    if (immediate) {
+      this.saveSessionsImmediate()
+    } else {
+      // Debounced save
+      if (this.saveTimer) {
+        clearTimeout(this.saveTimer)
+      }
+      this.saveTimer = setTimeout(() => {
+        this.saveSessionsImmediate()
+        this.saveTimer = null
+      }, APP_CONSTANTS.STORAGE_SAVE_DEBOUNCE_MS)
+    }
+  }
+
+  /**
+   * Immediately save sessions to localStorage
+   */
+  private saveSessionsImmediate(): void {
+    try {
+      const sessions = Array.from(this.sessions.values())
+      localStorage.setItem(APP_CONSTANTS.STORAGE_KEY_SESSIONS, JSON.stringify(sessions))
+
+      if (this.activeSessionId) {
+        localStorage.setItem(APP_CONSTANTS.STORAGE_KEY_ACTIVE_SESSION, this.activeSessionId)
+      }
+    } catch (error) {
+      logError('SessionManager', error, { context: 'saveSessionsImmediate' })
+
+      // If storage is full, try to delete oldest sessions
+      if (error instanceof Error && error.name === 'QuotaExceededError') {
+        console.warn('LocalStorage quota exceeded, deleting oldest sessions')
+        this.deleteOldestSession()
+        this.deleteOldestSession()
+        // Retry save
+        try {
+          const sessions = Array.from(this.sessions.values())
+          localStorage.setItem(APP_CONSTANTS.STORAGE_KEY_SESSIONS, JSON.stringify(sessions))
+        } catch (retryError) {
+          logError('SessionManager', retryError, { context: 'saveSessionsImmediate (retry)' })
+        }
+      }
+    }
+  }
+
+  /**
+   * Delete the oldest session (by updatedAt)
+   */
+  private deleteOldestSession(): void {
+    const sessions = this.getAllSessions()
+    if (sessions.length === 0) return
+
+    const oldest = sessions[sessions.length - 1]
+    this.deleteSession(oldest.id)
+  }
+
+  /**
+   * Generate a session preview from messages
+   */
+  private getSessionPreview(session: ChatSession): string {
+    const firstUserMessage = session.messages.find((msg) => msg.role === 'user')
+    if (firstUserMessage) {
+      return firstUserMessage.content.slice(0, 50) + (firstUserMessage.content.length > 50 ? '...' : '')
+    }
+    return ''
+  }
+
+  /**
+   * Generate a title from a message
+   */
+  private generateTitleFromMessage(content: string): string {
+    const cleaned = content.trim().replace(/\n/g, ' ')
+    const maxLength = APP_CONSTANTS.SESSION_TITLE_MAX_LENGTH
+    return cleaned.slice(0, maxLength) + (cleaned.length > maxLength ? '...' : '')
+  }
+
+  /**
+   * Generate a unique ID
+   */
+  private generateId(): string {
+    return `session-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`
+  }
+
+  /**
+   * Force save all sessions (call this before app closes)
+   */
+  public forceSync(): void {
+    if (this.saveTimer) {
+      clearTimeout(this.saveTimer)
+      this.saveTimer = null
+    }
+    this.saveSessionsImmediate()
+  }
+}
+
+// Export singleton instance
+export const sessionManager = new SessionManager()
diff --git a/src/renderer/src/services/tools.ts b/src/renderer/src/services/tools.ts
index 35b8464..c5452f0 100644
--- a/src/renderer/src/services/tools.ts
+++ b/src/renderer/src/services/tools.ts
@@ -1,33 +1,8 @@
 // AI Tool 定义和执行器
+import type { ToolDefinition, ToolCall, ToolResult } from '../types'
 
-export interface ToolDefinition {
-  type: 'function'
-  function: {
-    name: string
-    description: string
-    parameters: {
-      type: 'object'
-      properties: Record<string, any>
-      required: string[]
-    }
-  }
-}
-
-export interface ToolCall {
-  id: string
-  type: 'function'
-  function: {
-    name: string
-    arguments: string
-  }
-}
-
-export interface ToolResult {
-  tool_call_id: string
-  role: 'tool'
-  name: string
-  content: string
-}
+// Re-export types for backward compatibility
+export type { ToolDefinition, ToolCall, ToolResult }
 
 // 定义所有可用的工具
 export const availableTools: ToolDefinition[] = [
diff --git a/src/renderer/src/types/index.ts b/src/renderer/src/types/index.ts
new file mode 100644
index 0000000..0860b32
--- /dev/null
+++ b/src/renderer/src/types/index.ts
@@ -0,0 +1,253 @@
+// Unified type definitions for the entire application
+
+// ============================================
+// Message Types
+// ============================================
+
+export type MessageRole = 'user' | 'assistant' | 'system' | 'tool'
+
+export type ToolCallStatus = 'loading' | 'success' | 'error'
+
+export interface ToolCallInfo {
+  name: string
+  args?: Record<string, any>
+  result?: any
+  status: ToolCallStatus
+}
+
+export interface Message {
+  id: string
+  role: MessageRole
+  content: string
+  timestamp: Date
+  toolCalls?: ToolCallInfo[]
+  tool_call_id?: string
+  name?: string
+}
+
+// For AI service API calls (snake_case for API compatibility)
+export interface AIMessage {
+  role: MessageRole
+  content: string
+  tool_calls?: ToolCall[]
+  tool_call_id?: string
+  name?: string
+}
+
+// ============================================
+// Tool Types
+// ============================================
+
+export interface ToolCall {
+  id: string
+  type: 'function'
+  function: {
+    name: string
+    arguments: string
+  }
+}
+
+export interface ToolResult {
+  tool_call_id: string
+  role: 'tool'
+  name: string
+  content: string
+}
+
+export interface ToolDefinition {
+  type: 'function'
+  function: {
+    name: string
+    description: string
+    parameters: {
+      type: 'object'
+      properties: Record<string, any>
+      required: string[]
+    }
+  }
+}
+
+// ============================================
+// Model Configuration Types
+// ============================================
+
+export interface ModelConfig {
+  id: string
+  name: string
+  provider: string
+  model: string
+  apiKey: string
+  baseUrl: string
+}
+
+export interface Settings {
+  activeModelId?: string
+  modelConfigs: ModelConfig[]
+}
+
+// ============================================
+// Search & Article Types
+// ============================================
+
+export interface SearchResult {
+  title: string
+  url: string
+  author?: string
+  publishTime?: string
+  summary?: string
+  likeCount?: number
+  commentCount?: number
+}
+
+export interface SearchResponse {
+  success: boolean
+  error?: string
+  message?: string
+  loginGuide?: string
+  suggestions?: string
+  count?: number
+  results?: SearchResult[]
+  needLogin?: boolean
+  verificationRequired?: boolean
+  rateLimited?: boolean
+}
+
+export interface ArticleComment {
+  author: string
+  content: string
+  time?: string
+  replies?: Array<{
+    author: string
+    content: string
+    time?: string
+  }>
+}
+
+export interface ArticleStats {
+  likes: number
+  favorites: number
+  commentCount: number
+  hotScore: number
+}
+
+export interface Article {
+  title: string
+  author?: string
+  authorIp?: string
+  publishTime?: string
+  content: string
+  tags?: string[]
+  stats?: ArticleStats
+  comments?: ArticleComment[]
+}
+
+export interface ArticleResponse {
+  success: boolean
+  error?: string
+  article?: Article
+}
+
+// ============================================
+// Platform Login Types
+// ============================================
+
+export interface LoginStatusResponse {
+  success: boolean
+  error?: string
+  isLoggedIn: boolean
+  platform: string
+  username?: string
+  message?: string
+  loginGuide?: string
+}
+
+// ============================================
+// Stream Callback Types
+// ============================================
+
+export interface StreamCallbacks {
+  onStart?: () => void
+  onToken: (token: string) => void
+  onComplete: () => void
+  onError: (error: Error) => void
+  onToolCall?: (toolName: string, args: any) => void
+}
+
+// ============================================
+// Session Management Types
+// ============================================
+
+export interface ChatSession {
+  id: string
+  title: string
+  createdAt: Date
+  updatedAt: Date
+  messages: Message[]
+  messageCount: number
+}
+
+export interface SessionSummary {
+  id: string
+  title: string
+  createdAt: Date
+  updatedAt: Date
+  messageCount: number
+  preview?: string // First user message or custom preview
+}
+
+// ============================================
+// Error Types
+// ============================================
+
+export enum ErrorType {
+  NETWORK_ERROR = 'NETWORK_ERROR',
+  API_ERROR = 'API_ERROR',
+  TOOL_ERROR = 'TOOL_ERROR',
+  VALIDATION_ERROR = 'VALIDATION_ERROR',
+  NOT_LOGGED_IN = 'NOT_LOGGED_IN',
+  SECURITY_VERIFICATION = 'SECURITY_VERIFICATION',
+  RATE_LIMIT_EXCEEDED = 'RATE_LIMIT_EXCEEDED'
+}
+
+export interface AppError extends Error {
+  type: ErrorType
+  details?: any
+  recoverable?: boolean
+}
+
+// ============================================
+// Constants
+// ============================================
+
+export const APP_CONSTANTS = {
+  // Message loading
+  MAX_INITIAL_MESSAGES: 50,
+
+  // localStorage
+  STORAGE_SAVE_DEBOUNCE_MS: 2000,
+  STORAGE_KEY_MESSAGES: 'chat-messages', // Deprecated: use STORAGE_KEY_SESSIONS
+  STORAGE_KEY_SETTINGS: 'app-settings',
+  STORAGE_KEY_SESSIONS: 'chat-sessions',
+  STORAGE_KEY_ACTIVE_SESSION: 'active-session-id',
+
+  // Scrolling
+  SCROLL_DEBOUNCE_MS: 16, // One frame at 60fps
+
+  // Tool calling
+  MAX_TOOL_ITERATIONS: 10,
+  TOOL_TIMEOUT_MS: 30000,
+
+  // Rate limiting
+  SEARCH_MIN_INTERVAL_MS: 3000,
+  SEARCH_MAX_PER_MINUTE: 10,
+
+  // Performance
+  REQUEST_IDLE_TIMEOUT_MS: 1000,
+
+  // Session Management
+  MAX_SESSIONS: 50,
+  SESSION_TITLE_MAX_LENGTH: 50,
+  DEFAULT_SESSION_TITLE: '新对话'
+} as const
+
+export type AppConstants = typeof APP_CONSTANTS
diff --git a/src/renderer/src/utils/errorHandler.ts b/src/renderer/src/utils/errorHandler.ts
new file mode 100644
index 0000000..c5ec96d
--- /dev/null
+++ b/src/renderer/src/utils/errorHandler.ts
@@ -0,0 +1,189 @@
+import { ElMessage } from 'element-plus'
+import type { AppError, ErrorType } from '../types'
+
+/**
+ * Create a typed application error
+ */
+export function createAppError(
+  type: ErrorType,
+  message: string,
+  details?: any,
+  recoverable: boolean = true
+): AppError {
+  const error = new Error(message) as AppError
+  error.type = type
+  error.details = details
+  error.recoverable = recoverable
+  return error
+}
+
+/**
+ * Format error message for display
+ */
+export function formatErrorMessage(error: unknown): string {
+  if (error instanceof Error) {
+    return error.message
+  }
+  if (typeof error === 'string') {
+    return error
+  }
+  return '未知错误'
+}
+
+/**
+ * Display error message to user
+ */
+export function showErrorMessage(error: unknown, fallbackMessage?: string): void {
+  const message = formatErrorMessage(error)
+  ElMessage.error(message || fallbackMessage || '操作失败')
+}
+
+/**
+ * Handle API errors with proper error messages
+ */
+export function handleApiError(error: any): never {
+  console.error('API Error:', error)
+
+  if (error.response) {
+    const status = error.response.status
+    const data = error.response.data
+
+    switch (status) {
+      case 400:
+        throw createAppError('VALIDATION_ERROR', data?.message || '请求参数错误', data)
+      case 401:
+        throw createAppError('NOT_LOGGED_IN', '未登录或登录已过期', data, true)
+      case 403:
+        throw createAppError('API_ERROR', '没有权限访问该资源', data)
+      case 404:
+        throw createAppError('API_ERROR', '请求的资源不存在', data)
+      case 429:
+        throw createAppError(
+          'RATE_LIMIT_EXCEEDED',
+          '请求过于频繁，请稍后再试',
+          data,
+          true
+        )
+      case 500:
+      case 502:
+      case 503:
+        throw createAppError(
+          'API_ERROR',
+          '服务器错误，请稍后再试',
+          data,
+          true
+        )
+      default:
+        throw createAppError(
+          'API_ERROR',
+          data?.message || `请求失败 (${status})`,
+          data
+        )
+    }
+  }
+
+  if (error.request) {
+    // Request was made but no response received
+    throw createAppError(
+      'NETWORK_ERROR',
+      '网络连接失败，请检查网络设置',
+      error,
+      true
+    )
+  }
+
+  // Something else happened
+  throw createAppError('API_ERROR', error.message || '请求失败', error)
+}
+
+/**
+ * Handle tool execution errors
+ */
+export function handleToolError(toolName: string, error: unknown): AppError {
+  console.error(`Tool ${toolName} execution error:`, error)
+
+  if (error && typeof error === 'object') {
+    const err = error as any
+
+    // Check for specific error types
+    if (err.error === 'NOT_LOGGED_IN') {
+      return createAppError(
+        'NOT_LOGGED_IN',
+        `${toolName} 需要登录才能使用`,
+        error,
+        true
+      )
+    }
+
+    if (err.error === 'SECURITY_VERIFICATION') {
+      return createAppError(
+        'SECURITY_VERIFICATION',
+        '触发了安全验证，请稍后再试',
+        error,
+        true
+      )
+    }
+
+    if (err.error === 'RATE_LIMIT_EXCEEDED') {
+      return createAppError(
+        'RATE_LIMIT_EXCEEDED',
+        '操作过于频繁，请稍后再试',
+        error,
+        true
+      )
+    }
+  }
+
+  return createAppError(
+    'TOOL_ERROR',
+    `工具 ${toolName} 执行失败: ${formatErrorMessage(error)}`,
+    error,
+    true
+  )
+}
+
+/**
+ * Safe error logging with context
+ */
+export function logError(context: string, error: unknown, additionalInfo?: any): void {
+  console.error(`[${context}] Error:`, error)
+  if (additionalInfo) {
+    console.error(`[${context}] Additional info:`, additionalInfo)
+  }
+
+  // In production, you might want to send errors to a logging service
+  if (process.env.NODE_ENV === 'production') {
+    // TODO: Send to logging service (e.g., Sentry)
+  }
+}
+
+/**
+ * Retry wrapper for async operations
+ */
+export async function retryOperation<T>(
+  operation: () => Promise<T>,
+  options: {
+    maxRetries?: number
+    delayMs?: number
+    onRetry?: (attempt: number, error: unknown) => void
+  } = {}
+): Promise<T> {
+  const { maxRetries = 3, delayMs = 1000, onRetry } = options
+
+  let lastError: unknown
+
+  for (let attempt = 1; attempt <= maxRetries; attempt++) {
+    try {
+      return await operation()
+    } catch (error) {
+      lastError = error
+
+      if (attempt < maxRetries) {
+        onRetry?.(attempt, error)
+        await new Promise(resolve => setTimeout(resolve, delayMs * attempt))
+      }
+    }
+  }
+
+  throw lastError
+}
diff --git a/src/renderer/src/views/Chat.vue b/src/renderer/src/views/Chat.vue
index 68511ec..49aac94 100644
--- a/src/renderer/src/views/Chat.vue
+++ b/src/renderer/src/views/Chat.vue
@@ -1,164 +1,263 @@
 <template>
-  <div class="chat-container" :style="containerStyles">
-    <!-- Header -->
-    <div class="chat-header">
-      <h1 class="title">AI 对话</h1>
-      <div class="header-actions">
-        <el-button circle @click="openToolsPanel">
-          <el-icon><Tools /></el-icon>
-        </el-button>
-        <el-button circle @click="handleClear">
-          <el-icon><Delete /></el-icon>
-        </el-button>
-        <el-button circle @click="openSettings">
-          <el-icon><Setting /></el-icon>
-        </el-button>
-      </div>
-    </div>
-
-    <!-- Messages Area -->
-    <div ref="messagesContainer" class="messages-container">
-      <div v-if="messages.length === 0" class="empty-state">
-        <el-empty description="开始新对话" />
-      </div>
-
-      <MessageCard
-        v-for="message in messages"
-        :key="message.id"
-        :message="message"
+  <div class="chat-layout">
+    <!-- Session Sidebar -->
+    <div class="session-sidebar" :class="{ collapsed: sidebarCollapsed }">
+      <SessionList
+        :sessions="sessions"
+        :active-session-id="activeSessionId"
+        @select-session="handleSelectSession"
+        @create-session="handleCreateSession"
+        @rename-session="handleRenameSession"
+        @delete-session="handleDeleteSession"
       />
+    </div>
 
-      <!-- Loading indicator -->
-      <div v-if="isLoading" class="loading-indicator">
-        <el-icon class="is-loading" :size="20">
-          <Loading />
-        </el-icon>
-        <span>正在思考...</span>
+    <!-- Main Chat Area -->
+    <div class="chat-main">
+      <div class="chat-container" :style="containerStyles">
+        <!-- Header -->
+        <div class="chat-header">
+          <div class="header-left">
+            <el-button circle @click="toggleSidebar" size="small">
+              <el-icon><Fold v-if="!sidebarCollapsed" /><Expand v-else /></el-icon>
+            </el-button>
+            <h1 class="title">{{ currentSessionTitle }}</h1>
+          </div>
+          <div class="header-actions">
+            <el-button circle @click="openSearch" title="搜索消息 (Cmd+K)">
+              <el-icon><Search /></el-icon>
+            </el-button>
+            <el-button circle @click="openToolsPanel">
+              <el-icon><Tools /></el-icon>
+            </el-button>
+            <el-button circle @click="handleClear">
+              <el-icon><Delete /></el-icon>
+            </el-button>
+            <el-button circle @click="openSettings">
+              <el-icon><Setting /></el-icon>
+            </el-button>
+          </div>
+        </div>
+
+        <!-- Messages Area -->
+        <div ref="messagesContainer" class="messages-container">
+          <div v-if="currentMessages.length === 0" class="empty-state">
+            <el-empty description="开始新对话" />
+          </div>
+
+          <MessageCard
+            v-for="message in currentMessages"
+            :key="message.id"
+            :message="message"
+            :ref="(el) => messageRefs.set(message.id, el)"
+          />
+
+          <!-- Loading indicator -->
+          <div v-if="isLoading" class="loading-indicator">
+            <el-icon class="is-loading" :size="20">
+              <Loading />
+            </el-icon>
+            <span>正在思考...</span>
+          </div>
+        </div>
+
+        <!-- Input Area -->
+        <div class="input-container">
+          <div class="input-wrapper">
+            <el-input
+              ref="inputRef"
+              v-model="inputValue"
+              type="textarea"
+              :autosize="{ minRows: 1, maxRows: 4 }"
+              placeholder="输入消息..."
+              @keydown.enter.exact="handleKeyDown"
+              @compositionstart="handleCompositionStart"
+              @compositionend="handleCompositionEnd"
+            />
+            <el-button
+              type="primary"
+              circle
+              class="send-button"
+              :disabled="!inputValue.trim() || isLoading"
+              @click="handleSend"
+            >
+              <el-icon><Promotion /></el-icon>
+            </el-button>
+          </div>
+        </div>
       </div>
     </div>
 
-    <!-- Input Area -->
-    <div class="input-container">
-      <div class="input-wrapper">
-        <el-input
-          ref="inputRef"
-          v-model="inputValue"
-          type="textarea"
-          :autosize="{ minRows: 1, maxRows: 4 }"
-          placeholder="输入消息..."
-          @keydown.enter.exact="handleKeyDown"
-          @compositionstart="handleCompositionStart"
-          @compositionend="handleCompositionEnd"
-        />
-        <el-button
-          type="primary"
-          circle
-          class="send-button"
-          :disabled="!inputValue.trim() || isLoading"
-          @click="handleSend"
-        >
-          <el-icon><Promotion /></el-icon>
-        </el-button>
-      </div>
-    </div>
+    <!-- Message Search Dialog -->
+    <MessageSearch
+      v-model="searchDialogVisible"
+      :messages="currentMessages"
+      @select="handleSearchSelect"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, nextTick, onMounted, onUnmounted } from 'vue'
+import { ref, computed, nextTick, onMounted, onUnmounted } from 'vue'
 import { ElMessage } from 'element-plus'
-import { Delete, Setting, Loading, Promotion, Tools } from '@element-plus/icons-vue'
+import {
+  Delete,
+  Setting,
+  Loading,
+  Promotion,
+  Tools,
+  Search,
+  Fold,
+  Expand
+} from '@element-plus/icons-vue'
 import { useTheme } from '../composables/useTheme'
-import { chatWithTools, executeToolCalls, type Message as AIMessage } from '../services/aiService'
+import { chatWithTools, executeToolCalls } from '../services/aiService'
+import { sessionManager } from '../services/sessionManager'
 import MessageCard from '../components/MessageCard.vue'
-
-interface ToolCallInfo {
-  name: string
-  args?: Record<string, any>
-  result?: any
-  status: 'loading' | 'success' | 'error'
-}
-
-interface Message {
-  id: string
-  role: 'user' | 'assistant' | 'tool'
-  content: string
-  timestamp: Date
-  toolCalls?: ToolCallInfo[]
-}
-
-interface ModelConfig {
-  id: string
-  name: string
-  provider: string
-  model: string
-  apiKey: string
-  baseUrl: string
-}
+import SessionList from '../components/SessionList.vue'
+import MessageSearch from '../components/MessageSearch.vue'
+import type { Message, AIMessage, ModelConfig, ToolCallInfo, SessionSummary } from '../types'
+import { APP_CONSTANTS } from '../types'
+import { showErrorMessage, logError } from '../utils/errorHandler'
 
 const { theme } = useTheme()
-const messages = ref<Message[]>([])
 const inputValue = ref('')
 const isLoading = ref(false)
 const messagesContainer = ref<HTMLElement>()
 const inputRef = ref<any>(null)
+const searchDialogVisible = ref(false)
+const sidebarCollapsed = ref(false)
+
+// Session management - initialize as empty to avoid blocking component mount
+const sessions = ref<SessionSummary[]>([])
+const activeSessionId = ref<string | null>(null)
+
+// Message refs for scrolling to specific messages
+const messageRefs = new Map<string, any>()
 
 // IME composition state
 const isComposing = ref(false)
 
-// Debounce timer for localStorage writes
-let saveTimer: NodeJS.Timeout | null = null
+// Debounce timer for scrollToBottom
+let scrollTimer: NodeJS.Timeout | null = null
 
 const containerStyles = computed(() => ({
   backgroundColor: theme.value.colors.background,
   color: theme.value.colors.textPrimary
 }))
 
-// Load messages from localStorage with lazy loading
-onMounted(() => {
-  const mountTime = Date.now()
-  console.log('[PERF] Chat component mounted at:', mountTime)
+const currentSession = computed(() => {
+  if (!activeSessionId.value) return null
+  return sessionManager.getSession(activeSessionId.value)
+})
 
-  // Use setTimeout to defer message loading after initial render
-  setTimeout(() => {
-    const loadStartTime = Date.now()
-    console.log('[PERF] Starting message load at:', loadStartTime)
+const currentMessages = computed(() => {
+  return currentSession.value?.messages || []
+})
 
-    const savedMessages = localStorage.getItem('chat-messages')
-    if (savedMessages) {
-      try {
-        const parsed = JSON.parse(savedMessages)
-        console.log('[PERF] Total messages in storage:', parsed.length)
+const currentSessionTitle = computed(() => {
+  return currentSession.value?.title || APP_CONSTANTS.DEFAULT_SESSION_TITLE
+})
 
-        // Only load last 50 messages initially for better performance
-        const recentMessages = parsed.slice(-50)
-        messages.value = recentMessages.map((msg: any) => ({
-          ...msg,
-          timestamp: new Date(msg.timestamp)
-        }))
+// Session management handlers
+const handleSelectSession = (sessionId: string) => {
+  activeSessionId.value = sessionId
+  sessionManager.setActiveSession(sessionId)
+  sessions.value = sessionManager.getAllSessions()
+  nextTick(() => scrollToBottomImmediate())
+}
 
-        const loadEndTime = Date.now()
-        console.log('[PERF] Messages loaded. Count:', messages.value.length)
-        console.log('[PERF] Message load time:', loadEndTime - loadStartTime, 'ms')
-      } catch (error) {
-        console.error('Failed to load messages:', error)
-        messages.value = []
-      }
-    }
-  }, 0)
-
-  // Focus input on mount to ensure IME works
+const handleCreateSession = () => {
+  const newSession = sessionManager.createSession()
+  activeSessionId.value = newSession.id
+  sessions.value = sessionManager.getAllSessions()
+  // Focus input after creating new session
   nextTick(() => {
     if (inputRef.value) {
       inputRef.value.focus()
     }
   })
+}
+
+const handleRenameSession = (sessionId: string, newTitle: string) => {
+  sessionManager.renameSession(sessionId, newTitle)
+  sessions.value = sessionManager.getAllSessions()
+}
+
+const handleDeleteSession = (sessionId: string) => {
+  sessionManager.deleteSession(sessionId)
+  sessions.value = sessionManager.getAllSessions()
+  activeSessionId.value = sessionManager.getActiveSessionId()
+}
+
+const toggleSidebar = () => {
+  sidebarCollapsed.value = !sidebarCollapsed.value
+}
+
+// Search handlers
+const openSearch = () => {
+  searchDialogVisible.value = true
+}
+
+const handleSearchSelect = (message: Message) => {
+  // Scroll to the selected message
+  nextTick(() => {
+    const messageEl = messageRefs.get(message.id)
+    if (messageEl && messageEl.$el) {
+      messageEl.$el.scrollIntoView({ behavior: 'smooth', block: 'center' })
+      // Highlight the message briefly
+      messageEl.$el.style.backgroundColor = 'rgba(64, 158, 255, 0.1)'
+      setTimeout(() => {
+        messageEl.$el.style.backgroundColor = ''
+      }, 2000)
+    }
+  })
+}
+
+// Keyboard shortcuts
+const handleGlobalKeydown = (event: KeyboardEvent) => {
+  // Cmd+K or Ctrl+K - Open search
+  if ((event.metaKey || event.ctrlKey) && event.key === 'k') {
+    event.preventDefault()
+    openSearch()
+  }
+
+  // Cmd+N or Ctrl+N - New session
+  if ((event.metaKey || event.ctrlKey) && event.key === 'n') {
+    event.preventDefault()
+    handleCreateSession()
+  }
+
+  // Cmd+B or Ctrl+B - Toggle sidebar
+  if ((event.metaKey || event.ctrlKey) && event.key === 'b') {
+    event.preventDefault()
+    toggleSidebar()
+  }
+}
+
+onMounted(() => {
+  // Load sessions synchronously (they're already loaded in SessionManager constructor)
+  const loadStart = performance.now()
+  sessions.value = sessionManager.getAllSessions()
+  activeSessionId.value = sessionManager.getActiveSessionId()
+  const loadTime = performance.now() - loadStart
+  console.log(`[PERF] Sessions loaded in Chat component: ${loadTime.toFixed(2)}ms`)
+
+  // Focus input after sessions are loaded
+  nextTick(() => {
+    if (inputRef.value) {
+      inputRef.value.focus()
+    }
+    scrollToBottomImmediate()
+  })
+
+  // Add global keyboard shortcuts
+  window.addEventListener('keydown', handleGlobalKeydown)
 
   // Listen for initial text from main process (Command+K shortcut)
   window.electron.ipcRenderer.on('set-initial-text', (_: unknown, text: string) => {
     if (text) {
       inputValue.value = text
-      // Focus input after setting text
       nextTick(() => {
         if (inputRef.value) {
           inputRef.value.focus()
@@ -169,13 +268,18 @@ onMounted(() => {
 })
 
 onUnmounted(() => {
-  // Clean up IPC listener to prevent memory leaks
+  // Clean up IPC listener
   window.electron.ipcRenderer.removeAllListeners('set-initial-text')
 
-  // Flush any pending saves before unmounting
-  if (saveTimer) {
-    clearTimeout(saveTimer)
-    localStorage.setItem('chat-messages', JSON.stringify(messages.value))
+  // Remove global keyboard shortcuts
+  window.removeEventListener('keydown', handleGlobalKeydown)
+
+  // Force sync all sessions before unmounting
+  sessionManager.forceSync()
+
+  // Clear scroll timer
+  if (scrollTimer) {
+    clearTimeout(scrollTimer)
   }
 })
 
@@ -198,35 +302,30 @@ const getActiveModel = async (): Promise<ModelConfig | null> => {
   }
 }
 
-// Handle IME composition start
+// Handle IME composition
 const handleCompositionStart = () => {
   isComposing.value = true
 }
 
-// Handle IME composition end
 const handleCompositionEnd = () => {
   isComposing.value = false
 }
 
-// Handle keydown event (for Enter key)
 const handleKeyDown = (event: KeyboardEvent) => {
-  // Prevent sending message if IME is active
   if (isComposing.value) {
     return
   }
-
-  // Prevent default and send message
   event.preventDefault()
   handleSend()
 }
 
 const handleSend = async () => {
-  // Prevent sending if IME is active
-  if (isComposing.value) {
+  if (isComposing.value || !inputValue.value.trim() || isLoading.value) {
     return
   }
 
-  if (!inputValue.value.trim() || isLoading.value) {
+  if (!activeSessionId.value) {
+    ElMessage.error('没有活动会话')
     return
   }
 
@@ -243,19 +342,18 @@ const handleSend = async () => {
     timestamp: new Date()
   }
 
-  messages.value.push(userMessage)
-  inputValue.value = ''
+  // Add message to session
+  sessionManager.addMessage(activeSessionId.value, userMessage)
+  // No need to reload all sessions - just update the current session reference
 
-  // Save messages (debounced)
-  saveMessages()
-  scrollToBottom()
+  inputValue.value = ''
+  scrollToBottomImmediate()
 
   // Send to AI with tool calling support
   isLoading.value = true
 
   try {
-    // Convert to AI message format
-    const aiMessages: AIMessage[] = messages.value.map((msg) => ({
+    const aiMessages: AIMessage[] = currentMessages.value.map((msg) => ({
       role: msg.role,
       content: msg.content
     }))
@@ -265,7 +363,6 @@ const handleSend = async () => {
 
     const assistantResponse = await chatWithTools(aiMessages, {
       onStart: () => {
-        // Add placeholder for assistant message
         const placeholderMessage: Message = {
           id: (Date.now() + 1).toString(),
           role: 'assistant',
@@ -273,28 +370,38 @@ const handleSend = async () => {
           timestamp: new Date(),
           toolCalls: []
         }
-        messages.value.push(placeholderMessage)
+        sessionManager.addMessage(activeSessionId.value!, placeholderMessage)
+        // Don't reload all sessions on every start
       },
       onToken: (token: string) => {
         currentContent += token
-        // Update the last message (assistant's message)
-        const lastMessage = messages.value[messages.value.length - 1]
-        if (lastMessage && lastMessage.role === 'assistant') {
-          lastMessage.content = currentContent
-          scrollToBottom()
+        const session = sessionManager.getSession(activeSessionId.value!)
+        if (session && session.messages.length > 0) {
+          const lastMessage = session.messages[session.messages.length - 1]
+          if (lastMessage.role === 'assistant') {
+            lastMessage.content = currentContent
+            sessionManager.updateMessages(activeSessionId.value!, session.messages)
+            // Don't reload all sessions during streaming - this kills performance!
+            scrollToBottom()
+          }
         }
       },
       onComplete: () => {
-        saveMessages(true)
+        sessionManager.forceSync()
       },
       onError: (error: Error) => {
-        console.error('AI request failed:', error)
-        ElMessage.error(error.message || '请求失败，请检查配置')
-        // Remove the last message (failed assistant message)
-        messages.value.pop()
+        logError('AI Request', error)
+        showErrorMessage(error, '请求失败，请检查配置')
+        // Remove the last message
+        const session = sessionManager.getSession(activeSessionId.value!)
+        if (session && session.messages.length > 0) {
+          session.messages.pop()
+          sessionManager.updateMessages(activeSessionId.value!, session.messages)
+          // Update session list only when actually needed
+          sessions.value = sessionManager.getAllSessions()
+        }
       },
       onToolCall: (toolName: string, args: any) => {
-        // Add tool call to current message
         const toolCall: ToolCallInfo = {
           name: toolName,
           args,
@@ -302,85 +409,104 @@ const handleSend = async () => {
         }
         currentToolCalls.push(toolCall)
 
-        // Update last message with tool calls
-        const lastMessage = messages.value[messages.value.length - 1]
-        if (lastMessage && lastMessage.role === 'assistant') {
-          lastMessage.toolCalls = [...currentToolCalls]
-          scrollToBottom()
+        const session = sessionManager.getSession(activeSessionId.value!)
+        if (session && session.messages.length > 0) {
+          const lastMessage = session.messages[session.messages.length - 1]
+          if (lastMessage.role === 'assistant') {
+            lastMessage.toolCalls = [...currentToolCalls]
+            sessionManager.updateMessages(activeSessionId.value!, session.messages)
+            // Don't reload sessions during tool calls
+            scrollToBottom()
+          }
         }
       }
     })
 
-    // Tool calling loop - keep calling tools until AI stops requesting them
+    // Tool calling loop
     let currentResponse = assistantResponse
     let conversationMessages = [...aiMessages]
-    let maxIterations = 10 // Prevent infinite loops
+    let maxIterations = APP_CONSTANTS.MAX_TOOL_ITERATIONS
     let iteration = 0
 
+    const toolCallHistory: string[] = []
+    const maxSameToolCalls = 3
+
     while (currentResponse.tool_calls && currentResponse.tool_calls.length > 0 && iteration < maxIterations) {
       iteration++
-      console.log(`=== Tool Call Iteration ${iteration} ===`)
-      console.log('AI Response:', currentResponse)
-      console.log('Tool calls received:', currentResponse.tool_calls)
 
-      // Get the last assistant message (which should already exist from previous iteration or initial call)
-      let lastMessage = messages.value[messages.value.length - 1]
+      // Dead loop detection
+      const currentToolSignature = currentResponse.tool_calls
+        .map((tc) => `${tc.function.name}:${tc.function.arguments}`)
+        .join('|')
+
+      toolCallHistory.push(currentToolSignature)
+
+      if (toolCallHistory.length >= maxSameToolCalls) {
+        const recentCalls = toolCallHistory.slice(-maxSameToolCalls)
+        const allSame = recentCalls.every((sig) => sig === recentCalls[0])
+
+        if (allSame) {
+          console.error('Dead loop detected')
+          ElMessage.warning(`检测到循环调用，已自动停止`)
+          break
+        }
+      }
+
+      const session = sessionManager.getSession(activeSessionId.value!)
+      if (!session || session.messages.length === 0) break
+
+      let lastMessage = session.messages[session.messages.length - 1]
 
-      // Ensure we have an assistant message to work with
       if (!lastMessage || lastMessage.role !== 'assistant') {
-        console.error('Expected assistant message but got:', lastMessage)
+        console.error('Expected assistant message')
         break
       }
 
-      // Update the message with tool calls if not already set
       if (!lastMessage.toolCalls || lastMessage.toolCalls.length === 0) {
         lastMessage.toolCalls = currentResponse.tool_calls.map((tc) => ({
           name: tc.function.name,
           args: JSON.parse(tc.function.arguments),
           status: 'loading' as const
         }))
-        console.log('Tool call cards created:', lastMessage.toolCalls)
+        sessionManager.updateMessages(activeSessionId.value!, session.messages)
+        // Don't reload during tool call setup
         scrollToBottom()
       }
 
-      // Execute tool calls one by one and update status
+      // Execute tool calls
       const toolResults = []
       for (let i = 0; i < currentResponse.tool_calls.length; i++) {
         const toolCall = currentResponse.tool_calls[i]
-        console.log(`Executing tool call ${i + 1}/${currentResponse.tool_calls.length}:`, toolCall.function.name)
 
         try {
           const results = await executeToolCalls([toolCall])
           const toolResult = results[0]
-          console.log(`Tool call ${i + 1} result:`, toolResult)
           toolResults.push(toolResult)
 
-          // Update this tool call's status with result
           if (lastMessage && lastMessage.toolCalls && lastMessage.toolCalls[i]) {
             lastMessage.toolCalls[i].result = toolResult.content
             lastMessage.toolCalls[i].status = 'success'
+            sessionManager.updateMessages(activeSessionId.value!, session.messages)
+            // Don't reload during tool execution
             scrollToBottom()
           }
         } catch (error) {
-          console.error(`Tool call ${i + 1} error:`, error)
-          // Mark tool as failed
+          console.error('Tool call error:', error)
           if (lastMessage && lastMessage.toolCalls && lastMessage.toolCalls[i]) {
             lastMessage.toolCalls[i].status = 'error'
             lastMessage.toolCalls[i].result = JSON.stringify({ error: '工具执行失败' })
+            sessionManager.updateMessages(activeSessionId.value!, session.messages)
+            // Don't reload on error handling
             scrollToBottom()
           }
         }
       }
 
-      // Add current response and tool results to conversation history
       conversationMessages.push(currentResponse)
       conversationMessages.push(...toolResults)
 
-      // Get next response from AI
       currentContent = ''
-      console.log('Sending tool results back to AI. Conversation:', conversationMessages)
 
-      // Create a new assistant message for the next response
       const nextAssistantMessage: Message = {
         id: (Date.now() + iteration + 1000).toString(),
         role: 'assistant',
@@ -388,54 +514,61 @@ const handleSend = async () => {
         timestamp: new Date(),
         toolCalls: []
       }
-      messages.value.push(nextAssistantMessage)
+      sessionManager.addMessage(activeSessionId.value!, nextAssistantMessage)
+      // Don't reload sessions in tool loop
       scrollToBottom()
 
       currentResponse = await chatWithTools(conversationMessages, {
-        onStart: () => {
-          console.log('AI processing tool results...')
-        },
+        onStart: () => {},
         onToken: (token: string) => {
           currentContent += token
-          // Update the new assistant message content
           nextAssistantMessage.content = currentContent
-          scrollToBottom()
-        },
-        onComplete: () => {
-          console.log('AI response iteration completed')
+          const session = sessionManager.getSession(activeSessionId.value!)
+          if (session) {
+            sessionManager.updateMessages(activeSessionId.value!, session.messages)
+            // Don't reload during nested streaming
+            scrollToBottom()
+          }
         },
+        onComplete: () => {},
         onError: (error: Error) => {
-          console.error('AI request failed:', error)
-          ElMessage.error(error.message || '请求失败')
-          // Remove the failed message
-          const index = messages.value.indexOf(nextAssistantMessage)
-          if (index > -1) {
-            messages.value.splice(index, 1)
+          logError('AI Tool Response', error)
+          showErrorMessage(error, '请求失败')
+          const session = sessionManager.getSession(activeSessionId.value!)
+          if (session) {
+            const index = session.messages.indexOf(nextAssistantMessage)
+            if (index > -1) {
+              session.messages.splice(index, 1)
+              sessionManager.updateMessages(activeSessionId.value!, session.messages)
+              // Update sessions on error cleanup
+              sessions.value = sessionManager.getAllSessions()
+            }
           }
         }
       })
-
-      console.log('Next AI Response:', currentResponse)
     }
 
     if (iteration >= maxIterations) {
-      console.warn('Reached maximum tool call iterations')
       ElMessage.warning('工具调用次数过多，已停止')
     }
 
-    // Save final state
-    saveMessages(true)
-
+    sessionManager.forceSync()
+    // Update session list once at the end of the entire conversation flow
+    sessions.value = sessionManager.getAllSessions()
     scrollToBottom()
   } catch (error: any) {
-    console.error('AI request failed:', error)
-    ElMessage.error(error.message || '请求失败，请检查配置')
+    logError('Send Message', error)
+    showErrorMessage(error, '请求失败，请检查配置')
 
     // Remove user message if failed
-    messages.value = messages.value.filter((msg) => msg.id !== userMessage.id)
+    const session = sessionManager.getSession(activeSessionId.value!)
+    if (session) {
+      session.messages = session.messages.filter((msg) => msg.id !== userMessage.id)
+      sessionManager.updateMessages(activeSessionId.value!, session.messages)
+      sessions.value = sessionManager.getAllSessions()
+    }
   } finally {
     isLoading.value = false
-    // Re-focus input after message is sent
     nextTick(() => {
       if (inputRef.value) {
         inputRef.value.focus()
@@ -445,13 +578,10 @@ const handleSend = async () => {
 }
 
 const handleClear = () => {
-  messages.value = []
-  // Clear any pending save timer
-  if (saveTimer) {
-    clearTimeout(saveTimer)
-    saveTimer = null
-  }
-  localStorage.removeItem('chat-messages')
+  if (!activeSessionId.value) return
+
+  sessionManager.clearSession(activeSessionId.value)
+  sessions.value = sessionManager.getAllSessions()
   ElMessage.success('对话已清空')
 }
 
@@ -463,28 +593,22 @@ const openToolsPanel = () => {
   window.electron.ipcRenderer.send('open-tools-panel')
 }
 
-// Debounced save to localStorage (300ms delay)
-const saveMessages = (immediate = false) => {
-  if (immediate) {
-    // Save immediately (e.g., when closing window or after AI response)
-    localStorage.setItem('chat-messages', JSON.stringify(messages.value))
-    if (saveTimer) {
-      clearTimeout(saveTimer)
-      saveTimer = null
-    }
-  } else {
-    // Debounced save
-    if (saveTimer) {
-      clearTimeout(saveTimer)
-    }
-    saveTimer = setTimeout(() => {
-      localStorage.setItem('chat-messages', JSON.stringify(messages.value))
-      saveTimer = null
-    }, 300)
+const scrollToBottom = () => {
+  if (scrollTimer) {
+    clearTimeout(scrollTimer)
   }
+
+  scrollTimer = setTimeout(() => {
+    nextTick(() => {
+      if (messagesContainer.value) {
+        messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight
+      }
+      scrollTimer = null
+    })
+  }, APP_CONSTANTS.SCROLL_DEBOUNCE_MS)
 }
 
-const scrollToBottom = () => {
+const scrollToBottomImmediate = () => {
   nextTick(() => {
     if (messagesContainer.value) {
       messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight
@@ -494,10 +618,35 @@ const scrollToBottom = () => {
 </script>
 
 <style scoped>
+.chat-layout {
+  display: flex;
+  height: 100vh;
+  overflow: hidden;
+}
+
+.session-sidebar {
+  width: 280px;
+  flex-shrink: 0;
+  transition: all 0.3s ease;
+  overflow: hidden;
+}
+
+.session-sidebar.collapsed {
+  width: 0;
+  opacity: 0;
+}
+
+.chat-main {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
 .chat-container {
   display: flex;
   flex-direction: column;
-  height: 100vh;
+  height: 100%;
   font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial,
     sans-serif;
 }
@@ -516,10 +665,20 @@ const scrollToBottom = () => {
   z-index: 10;
 }
 
+.header-left {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
 .title {
   margin: 0;
-  font-size: 20px;
+  font-size: 18px;
   font-weight: 600;
+  max-width: 400px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .header-actions {
@@ -556,7 +715,8 @@ const scrollToBottom = () => {
 }
 
 @keyframes pulse {
-  0%, 100% {
+  0%,
+  100% {
     opacity: 1;
   }
   50% {
diff --git a/📋_阅读指南.txt b/📋_阅读指南.txt
deleted file mode 100644
index 7dbe31f..0000000
--- a/📋_阅读指南.txt
+++ /dev/null
@@ -1,175 +0,0 @@
-═══════════════════════════════════════════════════════════════════════════════
-                         AI Desktop 项目分析 - 阅读指南
-═══════════════════════════════════════════════════════════════════════════════
-
-本项目已完成深度代码分析。以下是各文档的快速导航：
-
-───────────────────────────────────────────────────────────────────────────────
-📊 分析文档概览
-───────────────────────────────────────────────────────────────────────────────
-
-1. 📌 START HERE - ANALYSIS_SUMMARY.md (236行 - 5分钟快速阅读)
-   └─ 完美开始点
-   └─ 五大分析维度总结
-   └─ 15个优化项目一览
-   └─ 优先级和工作量估算
-   └─ 立即行动清单
-
-2. 📖 CODE_ANALYSIS_REPORT.md (1312行 - 详细技术报告)
-   └─ 30个具体问题分析
-   └─ 每个问题的代码示例
-   └─ 详细的优化方案
-   └─ 按优先级分类 (P0/P1/P2)
-   
-   📍 重点章节：
-     • 第一部分：性能优化点 (6个问题)
-     • 第二部分：UX改进 (6个问题)
-     • 第三部分：代码质量 (6个问题)
-     • 第四部分：功能完善 (6个问题)
-     • 第五部分：错误处理 (6个问题)
-
-3. 💼 OPTIMIZATION_PRIORITIES.md (794行 - 实施指南)
-   └─ 优先级快速参考表
-   └─ 每个项目的具体实施步骤
-   └─ 代码示例和修改位置
-   └─ 预期改进效果
-   
-   📍 三个阶段：
-     • 第一阶段 (P0): 立即修复 - 本周完成 (11小时)
-     • 第二阶段 (P1): 改进体验 - 下周完成 (11小时)
-     • 第三阶段 (P2): 功能完善 - 1个月完成 (15小时)
-
-───────────────────────────────────────────────────────────────────────────────
-🎯 使用建议
-───────────────────────────────────────────────────────────────────────────────
-
-快速模式 (15分钟):
-  1. 阅读 ANALYSIS_SUMMARY.md 全文
-  2. 查看优先级表的快速参考
-  3. 了解关键问题和收益
-
-标准模式 (1小时):
-  1. 阅读 ANALYSIS_SUMMARY.md
-  2. 阅读 CODE_ANALYSIS_REPORT.md 的P0部分
-  3. 阅读 OPTIMIZATION_PRIORITIES.md 的第一阶段
-  4. 制定实施计划
-
-深度模式 (3小时):
-  1. 阅读所有三个文档
-  2. 为每个P0项目做代码审查
-  3. 为P1和P2项目做功能设计
-  4. 制定详细的3个月改进计划
-
-───────────────────────────────────────────────────────────────────────────────
-⚡ 优化项目速查表
-───────────────────────────────────────────────────────────────────────────────
-
-🔴 高优先级 (P0) - 本周完成 - 11小时
-  ✓ P0-1: Chat.vue 无限重渲染 (2h)          → 性能⬇️60-70%
-  ✓ P0-2: localStorage 同步写入 (1h)         → 性能⬇️60%
-  ✓ P0-3: 重复类型定义 + 错误处理 (3h)       → 质量⬆️90%
-  ✓ P0-4: 登录状态提示不及时 (1h)            → UX改进
-  ✓ P0-5: Playwright 进程崩溃 (3h)           → 稳定性⬆️80%
-
-🟡 中优先级 (P1) - 下周完成 - 11小时
-  • P1-1: 搜索结果缓存 (2h)                 → 减少80%重复请求
-  • P1-2: 工具调用进度显示 (1.5h)            → 用户体验改进
-  • P1-3: 文章Markdown支持 (1h)             → 内容展示优化
-  • P1-4: 提取魔法字符串 (1.5h)              → 代码可维护性⬆️
-  • P1-5: 死循环检测 (2h)                   → 防止AI无限调用
-
-🟢 低优先级 (P2) - 1个月完成 - 15小时
-  ○ P2-1: 对话导出/导入 (3h)
-  ○ P2-2: 多会话管理 (5h)
-  ○ P2-3: 消息搜索 (1h)
-  ○ P2-4: 语法高亮 (2h)
-  ○ P2-5: 单元测试 (4h)
-
-───────────────────────────────────────────────────────────────────────────────
-📈 预期改进收益
-───────────────────────────────────────────────────────────────────────────────
-
-性能指标:
-  渲染频率:        ⬇️ 60-70%
-  localStorage:   ⬇️ 60%
-  缓存命中率:     ⬆️ 80%
-  进程稳定性:     ⬆️ 80%
-
-代码质量:
-  类型错误:        ⬇️ 90%
-  代码重复度:     ⬇️ 50%
-  维护成本:        ⬇️ 40%
-
-用户体验:
-  新增功能:        +5个
-  缺陷修复:        +30个
-  满意度提升:     显著
-
-───────────────────────────────────────────────────────────────────────────────
-🚀 立即行动清单
-───────────────────────────────────────────────────────────────────────────────
-
-今天 (第1天):
-  [ ] 阅读 ANALYSIS_SUMMARY.md
-  [ ] 理解关键问题
-  [ ] 评估工作量
-  [ ] 组织开发团队
-
-本周 (第2-3天):
-  [ ] 完成P0-2: localStorage优化
-  [ ] 完成P0-4: 登录状态提示
-  [ ] 完成P0-1: 防抖scrollToBottom
-  [ ] 进行代码审查
-
-下周 (第4-7天):
-  [ ] 完成P0-3: 类型和错误统一
-  [ ] 完成P0-5: Playwright管理
-  [ ] 测试所有P0改进
-  [ ] 性能基准测试
-
-第3周:
-  [ ] 开始P1阶段项目
-  [ ] 持续测试
-
-───────────────────────────────────────────────────────────────────────────────
-📞 常见问题
-───────────────────────────────────────────────────────────────────────────────
-
-Q: 我应该从哪个文件开始？
-A: 从 ANALYSIS_SUMMARY.md 开始，5分钟内了解全局。
-
-Q: P0 项目有多紧急？
-A: 非常紧急。这些是影响性能和稳定性的关键问题。
-   建议本周内完成所有P0项目。
-
-Q: 总共需要多少工作量？
-A: 37小时（完整改进）
-   - 第一阶段: 11小时（性能关键）
-   - 第二阶段: 11小时（体验改进）
-   - 第三阶段: 15小时（功能完善）
-
-Q: 我是否需要重构整个项目？
-A: 不需要。所有改进都是增量式的，可以逐项实施。
-   不会影响现有功能。
-
-Q: 如何验证改进效果？
-A: 每个项目都有预期效果。建议：
-   1. 改进前做基准测试
-   2. 改进后重复测试
-   3. 对比数据验证
-
-───────────────────────────────────────────────────────────────────────────────
-📝 文件生成信息
-───────────────────────────────────────────────────────────────────────────────
-
-生成日期: 2024-11-14
-生成工具: Claude Code
-分析范围: 完整代码库
-分析深度: 深度代码分析
-输出文件: 3个详细报告
-
-────────────────────────────────────────────────────────────────────────────────────
-
-💡 提示: 将此指南文件添加到项目根目录，作为团队的参考资料。
-
-═══════════════════════════════════════════════════════════════════════════════