此页面由 Cloud Translation API 翻译。

开发者工具的新变化，Chrome 125

Sofia Emelianova

使用 Gemini 更好地在控制台中了解错误和警告

此 Chrome 版本在开发者工具控制台中引入了生成式 AI 功能，旨在帮助您更好地了解遇到的错误和警告。

如需获取 AI 针对错误或警告生成的说明，请点击控制台中相应消息旁边的 了解此错误（警告）按钮，然后按照说明操作。

AI 生成的错误说明。

如需了解详情，请参阅利用 AI 更好地了解错误和警告。

“元素”>“样式”中支持 `@position-try` 规则

为帮助您调试 CSS 锚点定位，元素 > 样式标签页现在支持 @position-try CSS 规则。该标签页会解析 position-try-options 值，并将每个选项链接到专用的 @position-try --name 部分。

支持 @position-try CSS 规则前后。

如需了解详情，请参阅 CSS Anchor Locationing API 简介。

Chromium 问题：40279608。

来源面板改进

此版本对 Sources 面板进行了多项改进。

配置自动美观输出和括号闭合功能

现在，您可以在来源中为编辑器启用或停用自动美观输出和括号关闭功能。美观输出可让缩减过的文件易读。当您输入左括号（) 或 }）或标记 (>) 时，括号右括号会自动添加右括号。

如需配置相关行为，请在设置 Settings > Preferences > Sources 中勾选或清除新的 check_box 自动右括号和 check_box 自动美观输出缩减过大小的源代码选项。

Chromium 问题：40865010、324314570。

已处理的遭拒 promise 被视为捕获

现在，如果您使用 .catch() 或两个参数 .then() 处理遭到拒绝的 promise，则 Sources 面板可以将这些 promise 正确识别为已捕获。

换句话说，当来源 > 断点 > check_box 发生未捕获异常时暂停处于开启状态时，调试程序不会在类似如下语句时暂停：

Promise.reject(new Error('fail')).catch((e)=>console.log('caught'));

发现遭拒情况之前和之后。

Chromium 问题：40283993。

控制台中的错误原因

控制台现在会显示堆栈轨迹中的错误原因链（如果有）。

为了简化调试，您可以在捕获和重新抛出错误时指定错误原因。随着控制台逐步展开原因链，它会输出带有 Caused by: 前缀的每个错误堆栈，因此您仍然可以看到原始错误。

输出带有“Caused by”前缀的堆栈轨迹之前和之后。

Chromium 问题：40182832。

网络面板改进

此版本对 Network 面板进行了多项改进。

检查 Early Hints 标头

Early Hints 标头在 Network 面板的请求 Headers 标签页中有一个专门的部分。以前，您可以在响应标头部分找到相关标头。

Early Hints 是一个 HTTP 状态代码 (103 Early Hints)，用于在最终响应之前发送初步 HTTP 响应。这样，当服务器忙于生成主要资源时，服务器就可以向浏览器发送关于可能使用的关键子资源（例如，样式表或关键 JavaScript）或来源的提示。

为 Early Hints 添加专用部分之前和之后。

如需了解详情，请参阅借助 Early Hints，利用服务器思考时间加快网页加载速度。

Chromium 问题：40222701。

隐藏“广告瀑布流”列

您现在可以在 Network 面板中隐藏 Waterfall 列，类似于隐藏其他列的方式。右键点击任意列名称，然后清除下拉菜单中的 check_box_outline_blank 瀑布图复选框。

添加用于隐藏“瀑布流”列的选项前后的对比。

Chromium 问题：40574989。

性能面板改进

此版本对 Performance 面板进行了多项改进。

捕获 CSS 选择器统计信息

性能面板新增了一项设置，可让您针对长时间运行的 Recalculate Style 事件捕获 CSS 选择器统计信息。

要查看统计信息，请选择一个重新计算样式事件，然后打开新的选择器统计信息标签页。该标签会显示有关每个选择器的耗时、匹配尝试次数和计数，以及慢路径不匹配项所占百分比的信息。

添加选择器统计信息之前和之后。

Chromium 问题：324282954。

更改顺序和隐藏轨道

性能面板提供了新的配置模式，让您可以更改轨道的顺序并隐藏轨道。

如需进入配置模式，请点击轨道名称左侧的修改修改按钮。然后，点击 arrow_upward 向上箭头或 arrow_downward 来移动曲目，或者点击 visibility_off 隐藏元素。完成后，点击轨道名称右侧的完成检查按钮。

下一版本 Chrome 126 将对此界面做出更多改进。

Chromium 问题：311439339。

忽略“Memory”面板中的保留器

现在，您可以在使用 Memory 面板捕获的堆快照中忽略保留器。

要忽略保留器，请选择一个对象，在保留器部分，右键点击保留器，然后从下拉菜单中选择忽略此保留器。在 Distance 列中，已忽略的保留器标有 ignored 值。要停止忽略，请点击顶部操作栏中的恢复忽略的保留器。

添加忽略保留器的选项之前和之后。

此外，堆快照现在支持更多数量（数亿个）包含边缘和节点 (332350576)。

Chromium 问题：327337527。

Lighthouse 11.7.1

Lighthouse 面板现在运行 Lighthouse 11.7.1。请参阅完整的更改列表。

值得注意的变化之一是对发布商广告插件的支持已弃用，该版本在此版本中已过时。

添加之前和之后移除发布商广告插件支持。

如需了解在开发者工具中使用 Lighthouse 面板的基础知识，请参阅 Lighthouse：优化网站速度。

Chromium 问题：772558。

其他亮点

以下是此版本中值得注意的一些修复和改进：

Recorder 面板现已正式退出预览状态 (329271496)。
现在，当自定义格式设置工具为 body() 函数返回 null 时，控制台不会显示错误，这是一种有效的行为 (329400119)。
Sources 面板更新了语法突出显示工具，尤其是，它现在支持在正则表达式中使用 v 和 d 标志。
网络 > Cookie 标签页修复了将豁免的 Cookie 映射到响应 Cookie 的 bug (41491846)。
Elements > Styles 标签页现在会执行以下操作：
- 显示具有自定义属性的完全过载的继承规则 (41489874)。
- 根据颜色主题在 light-dark() 中突出显示已应用的值 (331123816)。

下载预览渠道

请考虑将 Chrome Canary、开发者版或 Beta 版用作您的默认开发浏览器。通过这些预览渠道，您可以访问最新的开发者工具功能，测试先进的网络平台 API，并在用户之前发现您网站上的问题！

与 Chrome 开发者工具团队联系

使用以下选项讨论博文中的新功能和变更，或与开发者工具相关的任何其他内容。

请通过 crbug.com 提交建议或反馈。
在开发者工具中使用更多选项 > 帮助 > 报告开发者工具问题来报告开发者工具问题。
请发送电子邮件至 @ChromeDevTools。
请对我们的开发者工具新功能 YouTube 视频或开发者工具提示 YouTube 视频发表评论。