perf(worker): ⚡ 使用worker优化计时器不准确问题

[nongyehong]

升级依赖版本

💻 变更类型 | Change Type

• ✨ feat | 新增功能
• 🐛 fix | 修复缺陷
• ♻️ refactor | 代码重构（不包括 bug 修复、功能新增）
• 💄 style | 代码格式（不影响功能，例如空格、分号等格式修正）
• 📦️ build | 构建流程、外部依赖变更（如升级 npm 包、修改 vite 配置等）
• 🚀 perf | 性能优化
• 📝 docs | 文档变更
• 🧪 test | 添加疏漏测试或已有测试改动
• ⚙️ ci | 修改 CI 配置、脚本
• ↩️ revert | 回滚 commit
• 🛠️ chore | 对构建过程或辅助工具和库的更改（不影响源文件、测试用例）

🔀 变更说明 | Description of Change

📝 补充信息 | Additional Information

[socket-security]

New, updated, and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/@release-it/[email protected] 🔁 npm/@release-it/[email protected]	Transitive: environment, eval, network	+40	5.2 MB	webpro
npm/@release-it/[email protected] 🔁 npm/@release-it/[email protected]	Transitive: environment, filesystem, shell	+48	5.31 MB	webpro
npm/@types/[email protected] 🔁 npm/@types/[email protected]	None	0	2.29 MB	types
npm/@unocss/[email protected] 🔁 npm/@unocss/[email protected]	None	+7	1.05 MB	antfu, unocss-bot
npm/@unocss/[email protected] 🔁 npm/@unocss/[email protected]	None	0	49.7 kB	antfu
npm/@unocss/[email protected] 🔁 npm/@unocss/[email protected]	Transitive: unsafe	+6	2.74 MB	antfu, unocss-bot
npm/@unocss/[email protected] 🔁 npm/@unocss/[email protected]	None	+1	132 kB	antfu, unocss-bot
npm/@unocss/[email protected] 🔁 npm/@unocss/[email protected]	Transitive: filesystem	+30	3.67 MB	antfu
npm/@vitest/[email protected] 🔁 npm/@vitest/[email protected]	Transitive: environment, filesystem	+22	6.89 MB	vitestbot
npm/@vitest/[email protected] 🔁 npm/@vitest/[email protected]	None	+6	2.05 MB	vitestbot
npm/[email protected] 🔁 npm/[email protected]	None	0	999 kB	btmuli
npm/[email protected] 🔁 npm/[email protected]	Transitive: environment, eval, filesystem, network, shell, unsafe	+155	19.9 MB	webpro

View full report↗︎

[codecov]

Codecov Report

Attention: Patch coverage is 0.34247% with 291 lines in your changes missing coverage. Please review.

Files with missing lines	Patch %	Lines
src/services/webSocket.ts	0.00%	114 Missing ⚠️
src/workers/timer.worker.ts	1.21%	81 Missing ⚠️
src/workers/webSocket.worker.ts	0.00%	52 Missing ⚠️
src/stores/chat.ts	0.00%	36 Missing ⚠️
src/enums/index.ts	0.00%	5 Missing ⚠️
src/router/index.ts	0.00%	1 Missing ⚠️
src/services/http.ts	0.00%	1 Missing ⚠️
src/views/homeWindow/FriendsList.vue	0.00%	1 Missing ⚠️

Files with missing lines	Coverage Δ
src/components/rightBox/chatBox/ChatMain.vue	0.00% <ø> (ø)
src/router/index.ts	0.00% <0.00%> (-100.00%)	⬇️
src/services/http.ts	0.00% <0.00%> (-4.09%)	⬇️
src/views/homeWindow/FriendsList.vue	0.00% <0.00%> (ø)
src/enums/index.ts	0.66% <0.00%> (-99.34%)	⬇️
src/stores/chat.ts	0.00% <0.00%> (-29.62%)	⬇️
src/workers/webSocket.worker.ts	0.74% <0.00%> (ø)
src/workers/timer.worker.ts	1.21% <1.21%> (ø)
src/services/webSocket.ts	0.00% <0.00%> (ø)

... and 66 files with indirect coverage changes

[github-actions]

PR 代码分析

### 代码变更分析总结

1. 代码逻辑的改动

• ChatMain.vue:

  • 移除了清理过期定时器的逻辑，这可能是因为这部分逻辑移到了其他地方或者不再需要。

• index.ts (枚举):

  • 添加了 ConnectionState 枚举，用于表示连接状态（如连接中、已连接、断开等），增强了代码的可读性和维护性。

• router/index.ts:

  • 新增了一个名为 mobileMessage 的路由名称，并设置了默认重定向路径为 /mobile/message。

• http.ts:

  • 移除了响应日志输出，改为更简洁的日志格式，并修正了错误处理的日志信息，使其更符合中文习惯。

• webSocket.ts:

  • 引入了消息队列大小限制和 LRU 缓存机制来处理重复消息。
  • 增加了对 WebSocket 错误的详细处理逻辑，包括提示用户刷新页面。
  • 添加了连接状态变化的事件通知机制。
  • 使用 Worker 来处理 WebSocket 连接的重连逻辑，增强了异步处理能力。

• chat.ts:

  • 使用 Worker 来处理撤回消息的定时器，避免了主进程中的大量定时器导致性能问题。
  • 移除了直接在主进程中设置定时器的逻辑，改为通过 Worker 进行管理。
  • 新增了对 Worker 消息的监听和处理逻辑。

• FriendsList.vue:

  • 移除了 v-slide 指令，可能是为了简化布局或优化性能。

• timer.worker.ts 和 webSocket.worker.ts:

  • 新建了 timer.worker.ts 文件，专门用于处理定时器任务，提高了代码的模块化和可维护性。
  • 修改并重命名了 Worker.ts 为 webSocket.worker.ts，增加了心跳检测、重连逻辑优化等功能。

2. 潜在的问题或优化空间

• ChatMain.vue:

  • 移除 clearAllExpirationTimers() 可能会导致某些情况下定时器未被正确清理，需确保其他地方有相应的处理逻辑。

• http.ts:

  • 日志输出的修改虽然使代码更简洁，但可能会影响调试时的可见性。建议保留关键日志，特别是在开发环境中。

• webSocket.ts:

  • 消息队列和缓存的大小限制是合理的，但需要确保这些值适合实际应用场景，避免过早丢弃重要消息。
  • WebSocket 错误处理中提示用户刷新页面的操作应谨慎使用，最好提供更优雅的恢复机制。

• chat.ts:

  • 使用 Worker 处理定时器是一个很好的优化，但需要注意 Worker 的生命周期管理，确保在不需要时及时终止。

3. TypeScript 类型定义的准确性

• 整体来看，类型定义较为准确，特别是新增的 ConnectionState 枚举和 Worker 中的类型定义。但在一些地方可以进一步明确类型，例如：
  • #processedMsgCache 的键值类型可以更加具体化。
  • Worker 之间的通信消息类型可以定义为接口或类型别名，以提高代码的可读性和可维护性。

4. Vue 组件的性能影响

• FriendsList.vue:

  • 移除 v-slide 指令可能会对动画效果产生影响，但对性能的影响较小，主要取决于具体的 UI 设计需求。

• ChatMain.vue:

  • 移除定时器清理逻辑如果影响到组件卸载时的行为，可能会导致内存泄漏或资源浪费，需进一步验证。

5. Rust 代码的安全性和性能

• 本次变更中没有涉及 Rust 代码，因此无需特别关注 Rust 方面的安全性和性能问题。

总结

本次代码变更主要集中在 WebSocket 和定时器的优化上，引入了 Worker 来处理耗时任务，提升了代码的模块化和性能。同时，新增了连接状态管理和详细的错误处理逻辑，增强了系统的健壮性。需要注意的是，部分逻辑的移除或调整可能会带来潜在的风险，建议在测试环境中充分验证。

*这是由通义千问 AI 自动生成的 PR 分析，仅供参考。*