内置专业 Web 调试引擎

专为现代化 Web 研发打造的开发者工具

Firefox 内置无需安装额外插件的高性能 DevTools 套件。涵盖深度的 CSS 布局分析、网络抓包监视、JavaScript 引擎诊断与响应式排版调试，助你精准定位全栈调试难题。

探索核心工具
可视化网格与 Flex 覆盖层
直观标记网格线、轨道尺寸与弹性盒间隙布局。
HTTP/3 & API 请求抓包
无缝重发 API 载荷、分析响应标头与限制网络带宽。
源码级 Map 断点排查
支持条件断点、异步堆栈追溯与内存快照比较。

网络监视器与 API 请求重放抓包

实时捕捉 HTTP/1.1、HTTP/2 及 HTTP/3 网络通信。内置请求编辑与重发 (Edit & Resend) 功能，无需借助第三方抓包软件即可轻松分析接口 Payload、响应 Header 与 WebSocket 数据流。

状态 方法 请求 URL 域名与路径 类型 大小 操作
200 OK GET /api/v1/user/profile fetch 1.2 KB 编辑并重发
101 Switch WS wss://stream.firefox.com/v2/events websocket -- 查看帧数据
304 Stale GET /assets/app.main.min.js script 245 KB 查看瀑布图

源码级 JavaScript 断点调试与控制台

强大且流畅的 JS 调试体验。完美解析 Sourcemap 真实源码，支持在异步堆栈中设置条件断点、DOM 变更断点以及 XHR 拦截断点，辅以内存堆快照分析，轻松定位内存泄漏。

条件断点与 Logpoint

只在表达式计算结果为 true 时暂停代码执行，或使用 Logpoint 直接打日志而不必重新污染源代码。

14 function handleSync(data) {
15 if (data.retry > 3) debug();
16 }

Sourcemap 真实代码解析

无缝对接 Webpack, Vite, Rollup 构建产物，直接调试 TypeScript、React JSX 与 Vue 单文件组件原始源码。

// Source: App.tsx (Mapped)
const [state, setState] = useState();

内存堆快照分析

生成 Heap Snapshot 对比前后差异，精细化追踪未释放的 DOM 引用与未清除的闭包定时器。

Snapshot #1: 14.2 MB
Snapshot #2: 18.9 MB (+4.7MB)