改进了“效果”面板
此版本对性能面板进行了一些改进。
性能中的配置文件和函数调用的来源和脚本链接
现在,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
- 推测现在支持规则标记
- Lighthouse 12.6.0
- 其他亮点
- 无障碍功能
- 改进了“效果”面板
- 新的效果分析
- 点击即可突出显示
- “网络请求摘要”中的服务器计时
- 在“隐私和安全”中过滤 Cookie
- 各个面板中表格的大小(以 kB 为单位)
- 自动补全功能支持“元素”>“样式”中的边角形状和边角*-形状
- 实验性功能:突出显示 DOM 中元素和属性存在的问题
- Lighthouse 12.5.0
- 其他亮点
- 改进了“效果”面板
- 性能中的个人资料和函数调用的来源和脚本链接
- 按阶段划分的 LCP 实地数据支持
- 网络依赖关系树数据分析
- “摘要”中显示时长,而不是总时间和自身时间
- “执行用时最长的堆栈”突出显示功能
- 改进了各种面板的空状态
- “元素”中的无障碍功能树状视图
- Lighthouse 12.4.0
- 其他亮点
- “隐私和安全”面板
- 改进了“效果”面板
- 校准后的 CPU 节流预设
- 在同一 AI 对话中选择不同的效果活动
- “效果”中的第一方和第三方突出显示
- 标记工具提示和分析洞见中的实测数据
- 强制自动重排数据分析
- “优化 DOM 大小”数据洞见
- 使用 console.timeStamp 扩展性能轨迹
- “元素”面板改进
- 动画样式的实时值
- 支持 :open 伪类和各种伪元素
- 复制所有控制台消息
- “内存”面板中的字节单位
- 其他亮点
- 持久的 AI 聊天记录
- 改进了“效果”面板
- 图片投放分析数据
- 传统键盘导航和现代键盘导航
- 忽略火焰图中的无关脚本
- 悬停时显示时间轴标记和范围突出显示效果
- 建议的限制设置
- 叠加层中的时间标记
- “摘要”中的 JS 调用堆栈轨迹
- 徽章设置已移至 Elements 中的菜单
- 新增“新变化”面板
- Lighthouse 12.3.0
- 其他亮点
- 使用 Gemini 调试网络请求、源文件和性能轨迹
- 查看 AI 聊天记录
- 在“应用”>“存储空间”中管理扩展程序存储空间
- 性能改进
- 实时指标中的互动阶段
- “摘要”标签页中的渲染阻塞信息
- 支持 scheduler.postTask 事件及其发起者箭头
- “动画”面板和“元素”>“样式”标签页改进
- 从“元素”>“样式”跳转到“动画”
- “计算”标签页中的实时更新
- 传感器中的计算压力模拟
- “内存”面板中按来源分组的同名 JS 对象
- 设置页面焕然一新
- “性能数据分析”面板已弃用,并已从开发者工具中移除
- 其他亮点
- 使用 Gemini 调试 CSS
- 在专用设置标签页中控制 AI 功能
- 改进了“效果”面板
- 添加注释并分享效果发现
- 直接在“效果”面板中获取效果分析
- 更轻松地发现过度的布局偏移
- 找出未合成的动画
- 硬件并发移至传感器
- 忽略匿名脚本,专注于堆栈轨迹中的代码
- 元素 > 样式:支持网格叠加层和 CSS 范围关键字的 sideways-* 书写模式
- 在时间跨度和快照模式下针对非 HTTP 网页运行 Lighthouse 审核
- 无障碍功能改进
- 其他亮点
- 网络面板改进
- 重新构想的网络过滤器
- HAR 导出功能现在默认排除敏感数据
- “元素”面板改进
- text-emphasis-* 属性的自动补全值
- 使用徽章标记滚动溢出
- 改进了“效果”面板
- 实时指标中的建议
- 浏览面包屑导航
- “内存”面板改进




