改进了“效果”面板
此版本对性能面板进行了一些改进。
性能中的配置文件和函数调用的来源和脚本链接
现在,Performance > Summary 标签页会显示指向相关脚本和来源(针对配置文件和函数调用)的链接,因此您无需将鼠标悬停在主轨道中的这些事件上。
此外,现在当您将鼠标悬停在事件上时,网络和主轨道会在提示中显示第三方名称(如果有)。
Chromium 问题:368541957。
“按阶段划分的 LCP”字段数据支持
启用实测数据后,效果 > 数据洞见 > 按阶段划分的 LCP 数据洞见现在会在一个额外的表格中显示来自 Chrome 用户体验报告的第 75 百分位图片时间,以便您直接在数据洞见中比较这些时间。
“网络依赖关系树”数据分析
性能 > 数据分析标签页在其集合中添加了新的网络依赖树数据分析。此数据洞见会告知您是否存在链接关键请求的情况,我们不建议这样做。将鼠标悬停在信息中心内列出的请求上,即可在网络轨道中看到这些请求突出显示。
如需了解详情,请参阅避免链接关键请求。
“执行用时最长的堆栈”突出显示
现在,当您在调用树或自下而上 > 最重的堆栈边栏中将鼠标悬停在主轨道中的项上时,性能面板会突出显示这些项,并使其余项变暗。这样一来,您就可以直观地找到调用堆栈中耗时最多的嵌套项。
“元素”中的无障碍功能树状视图
现在,元素面板中默认处于开启状态的是整页模式的无障碍功能树视图。
之前,您可以在元素 > 无障碍功能标签页中浏览单独的无障碍功能树。现在,您可以点击元素面板中 DOM 树右上角的 切换到无障碍功能树状视图按钮,在 DOM 树和全页无障碍功能树之间来回切换,以便更轻松地探索它们及其关系。
借助可访问性树,您可以检查辅助技术如何查看您的内容,并查看 DOM 节点的 ARIA 属性和计算出的可访问性属性。如需了解详情,请参阅 Chrome 开发者工具中的完整无障碍树。
Chromium 问题:40808541。
改进了各种面板的空白状态
我们简化了各种面板、部分和标签页的空白状态(未打开任何内容时),以便您确切了解如何开始使用它们。现在,某些空状态(例如网络面板中的空状态)具有相关的实用按钮,例如重新加载页面。
“向 AI 提问”选项已移至菜单底部
向 AI 提问选项现在位于下拉菜单底部,而不是顶部。
欢迎在 crbug.com/364805393 的 AI 辅助面板中留下您的反馈。
Lighthouse 12.4.0
Lighthouse 面板现在运行的是 Lighthouse 12.4.0。
此版本在通过条件下将一些性能审核标记为信息性,而不是将其隐藏在“已通过的审核”部分中。请参阅完整的变更列表。
如需了解有关在开发者工具中使用 Lighthouse 面板的基础知识,请参阅 Lighthouse:优化网站速度。
Chromium 问题:40543651。
其他亮点
此版本包含以下值得注意的修复和改进:
- 性能 > 摘要:将两行“总时间”和“自用时间”替换为一行“时长”,该行还会显示括号中的
(self time)(如果有)(crbug.com/395572753)。 - 问题:添加了新的问题类型:可访问性树中的
<select>问题和在网络服务中进行解析或验证期间发生的 SRI 消息签名错误 (crbug.com/381044049、crbug.com/347890366)。 - 无障碍功能:元素 > 样式标签页现在会突出显示您使用键盘导航逐步浏览的元素 (crbug.com/396311936)。
- 元素:现在支持
<select>的问题,并以波浪下划线突出显示(crbug.com/378738916)。 - 网络:“覆盖点”和 Cookie 警告图标现在显示在标签页名称的右侧,而不是左侧 (crbug.com/390556283)。
下载预览渠道
不妨考虑使用 Chrome Canary 版、开发者版或 Beta 版作为默认开发浏览器。通过这些预览渠道,您可以访问最新的 DevTools 功能,测试最前沿的 Web 平台 API,并在用户发现问题之前帮助您找到网站上的问题!
与 Chrome 开发者工具团队联系
您可以使用以下选项讨论新功能、更新或与开发者工具相关的任何其他内容。
- 请前往 crbug.com 向我们提交反馈和功能请求。
- 在开发者工具中,依次选择 更多选项 > 帮助 > 报告 DevTools 问题,以报告 DevTools 问题。
- 在 Twitter 上向 @ChromeDevTools 发送推文。
- 在 DevTools 新变化 YouTube 视频或 DevTools 提示 YouTube 视频中发表评论。
开发者工具的新变化
开发者工具的新变化系列中涵盖的所有内容。
- 开发者工具 MCP 服务器更新
- 改进了轨迹分享功能
- 对 @starting-style 的支持
- 用于显示的编辑器 widget:masonry
- Lighthouse 13
- Gemini 提供的代码建议
- 开发者工具 MCP 服务器的增强功能
- 更快地获取 AI 助理的帮助
- 使用 Gemini 调试完整性能轨迹
- 切换抽屉式导航栏方向
- Google 开发者计划
- 其他亮点
- 适用于 AI 代理的 Chrome 开发者工具 (MCP)
- 使用 Gemini 调试网络依赖树
- 导出与 Gemini 的对话
- “效果”面板中的持久轨道配置
- 过滤 IP 地址保护网络请求
- 元素 > 布局标签页添加了瀑布流布局支持
- Lighthouse 12.8.2
- 其他亮点
- 使用 Gemini 调试更多分析洞见
- 在“网络状况”中模拟“Save-Data”标头
- 在 CSS 属性提示中查看基准状态
- 替换用户代理客户端提示中的设备规格
- Lighthouse 12.8.0
- 其他亮点
- 更可靠、更高效的 Chrome 开发者工具
- 在 AI 辅助功能中上传图片以进行样式设置
- 向“网络”中的表格添加请求标头
- 查看 2025 年 Google I/O 大会的亮点
- 其他亮点
- 改进了“效果”面板
- “网络依赖关系树”数据洞见中的预连接源
- “文档请求延迟时间”数据洞见中的服务器响应和重定向时间
- “网络请求摘要”中的重定向
- 减少了性能轨迹中的噪声
- 已弃用“停用 JavaScript 示例”
- 传感器中的地理定位精确度形参
- “元素”面板改进
- 更轻松地调试复杂的 CSS 值
- Elements 中的@function 支持 > 样式
- 网络面板改进
- has-request-header 过滤条件
- 独立式 Web 应用中的直接套接字
- 其他亮点
- 无障碍功能
- 2025 年 Google I/O 大会版
- 使用 Gemini 修改 CSS 并将更改保存到工作区
- 连接工作区文件夹并将更改保存回源文件
- 向 Gemini 询问有关效果分析的问题
- 使用 Gemini 为效果分析结果添加注释
- 在与 Gemini 的对话中添加屏幕截图
- “效果”面板中的新数据洞见
- 重复的 JavaScript
- 旧版 JavaScript
- 推测现在支持规则标记




