Browser Debugging 是一份面向客户端调试的技能指南，主题是使用浏览器开发者工具来定位和修复前端问题。
用途 该指南用于调试客户端侧问题，包括 JavaScript 错误、布局问题以及性能问题。它列出了适合使用的典型场景：JavaScript 错误、布局/样式问题、性能问题、用户交互问题、网络请求失败、动画故障。
主要能力 指南以 Chrome DevTools 的标签页为线索介绍调试能力：
- Elements/Inspector：检查 HTML 结构、实时编辑 HTML/CSS、查看计算样式、检查无障碍树、修改 DOM。
- Console：查看 JavaScript 错误、执行 JavaScript、查看控制台日志、监控消息、清除错误。
- Sources/Debugger：设置断点、单步执行代码、监视变量、查看调用栈、条件断点。
- Network：查看所有请求。 资料中 Network 部分仅给出“查看所有请求”这一条，其余内容标注为“// ... (see reference guides for full implementation)”，即完整实现需参阅参考指南。
使用方式 指南提供“快速上手”章节，给出一个最小可用示例，即上述 Chrome DevTools 各标签页的用途清单。此外，参考资料位于 references/ 目录，包含四份详细指南：Browser DevTools Fundamentals（浏览器开发者工具基础）、Debugging Techniques（调试技巧）、Common Issues & Solutions（常见问题与解决方案）、Performance Debugging（性能调试）。
适用场景 适用于需要排查浏览器端 JavaScript 报错、页面布局或样式异常、性能瓶颈、用户交互异常、网络请求失败以及动画异常等前端调试工作。
限制 资料未提供具体的安装命令、代码示例细节、收费或价格信息、支持平台范围以及实际使用效果说明；Network 面板的完整实现细节需查阅参考指南，本页未展开。最佳实践部分仅给出通用原则：应遵循既有模式与约定、编写整洁可维护的代码、添加适当文档、部署前充分测试；不应跳过测试或验证、忽略错误处理、硬编码配置值。