DevRecorder

DevRecorder 是一款专为开发者设计的 Chrome 扩展，能够在录制屏幕的同时捕获控制台日志、网络请求和导航事件，并将所有数据同步到统一的时间轴上。只需点击录制、复现 Bug，然后分享链接，你的团队就能看到视频与每条日志、请求头、响应体以及路由变化精确锁定到对应帧。支持本地、预发布和生产环境。通过 MCP 连接，Claude Code、Cursor、Windsurf 等 AI 工具可将你的录制内容作为结构化上下文读取。

核心功能

• 同步录制：屏幕画面与开发者工具数据（控制台、网络、导航）完美同步，时间轴精确到帧。
• 一键分享：录制完成后生成链接，团队成员无需安装扩展即可查看完整回放。
• AI 集成：通过 MCP 协议，AI 工具能直接读取录制内容作为上下文，辅助调试和分析。

主要特性

• 多环境支持：可在 localhost、staging 和 production 环境下录制，覆盖开发全流程。
• 数据丰富：捕获所有请求头、响应体、控制台日志和路由变化，不遗漏任何细节。
• 轻量易用：作为 Chrome 扩展，安装即用，无需额外配置。
• 协作友好：录制内容附带结构化数据，方便团队复现和讨论问题。
• 安全可控：录制数据仅通过链接分享，可设置访问权限。

适用场景

• Bug 复现：开发者录制 Bug 复现过程，附带完整上下文，节省沟通成本。
• 代码审查：记录 UI 交互和网络请求，辅助审查逻辑正确性。
• AI 辅助调试：将录制内容提供给 AI 工具，获得更精准的问题分析和修复建议。
• 团队协作：非技术人员也能通过视频和数据快速理解问题，提升协作效率。