Chrome 132 开发者工具的新变化

Sofia Emelianova
Sofia Emelianova

使用 Gemini 调试网络请求、源文件和性能轨迹

除了 CSS 样式之外,您现在还可以与 Gemini 聊天,讨论网络请求、源文件和性能轨迹。

Elements 面板中的上下文菜单类似,如需打开 AI 协助面板并与 Gemini 开始聊天,请右键点击并选择 Ask AI,或点击以下内容旁边的 Ask AI 按钮:

  • 网络面板中的网络请求。
  • 来源 > 网页标签页中的文件。
  • 效果 > 主要轨道中的活动。

“广告网络”“来源”和“效果”中的“询问 AI”按钮和菜单选项。

Gemini 会考虑所选请求、文件或活动的上下文。

开发者工具团队期待您在 crbug.com/364805393 中提供反馈。

AI 对话记录

现在,您可以在AI 帮助面板中恢复和查看与 Gemini 的过往对话,方法是点击面板左上角的 新对话按钮,或使用广告网络面板的询问 AI 按钮和菜单选项,依次选择来源 > 网页标签页,以及效果 > 主要轨道。

如需查看之前的某次对话,请从 History 按钮下方的下拉菜单中选择相应提示。在开发者工具打开期间,AI 帮助面板会记住您的聊天记录。

“历史记录”按钮下方的下拉菜单中的 AI 聊天记录。

在“应用”>“存储空间”中管理扩展程序存储空间

与本地存储空间和会话存储空间类似,您现在可以在 Application(应用)> Storage(存储空间)部分查看和更改扩展程序存储空间条目

在“应用”面板中添加“扩展程序存储空间”部分之前和之后。

Chromium 问题:crbug.com/40963428

提升了性能

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

实时指标中的互动阶段

现在,您可以在效果实时指标中展开“互动”部分,查看各个阶段及其时间细分。

在互动中添加相应阶段及其时间安排之前和之后。

正如Web Vitals 扩展程序现已集成到开发者工具中一文中所述,这些功能的发布标志着 Web Vitals 扩展程序的支持即将结束。

Chromium 问题:crbug.com/369097528

“摘要”标签页中的呈现屏蔽信息

当您在性能 > 网络轨道中选择标记为红色三角形的网络请求时,除了(重构后的)提示之外,摘要标签页现在还会告知您该请求会阻塞渲染。

在“摘要”标签页中添加渲染阻塞信息前后。

支持 scheduler.postTask 事件及其发起者箭头

效果 > 主要轨道现在会显示 scheduler.postTask() 事件,以及以下发起器箭头:

  • Schedule postTask -> Fire postTask
  • Schedule postTask -> Abort postTask

添加对 scheduler.postTask 事件及其发起者箭头的支持之前和之后。

Chromium 问题:crbug.com/40775984

改进了“动画”面板和“元素”>“样式”标签页

此版本对动画面板和元素 > 样式标签页进行了一些改进。

元素 > 样式标签页现在会在 animation 属性的值旁边放置一个动画 跳转到“动画”面板按钮,以便您在该处轻松修改动画。

将“样式”标签页中的链接添加到“动画”面板之前和之后。

“计算”标签页中的实时更新

现在,当动画更新计算值时,元素 > 计算标签页会实时更新计算值。

在传感器中计算压力模拟

现在,您可以使用传感器面板模拟 NominalFairSeriousCritical CPU 压力。

在传感器面板中添加 CPU 压力模拟选项之前和之后。

Chromium 问题:crbug.com/362277525

内存面板中按来源分组的同名 JS 对象

内存面板现在会区分来自不同来源的同名 JS 对象,并相应地对它们进行分组。

按来源对同名 JS 对象进行分组之前和之后。

Chromium 问题:crbug.com/357902505

全新设置

为了更好地统一用户界面设计,DevTools 设置现在看起来更像 Chrome 设置。具体而言,现在各个部分在视觉上会分隔为“卡片”。

将部分拆分为“卡片”之前和之后的效果。

“性能数据分析”面板已弃用并从开发者工具中移除

效果数据分析面板中的所有重要实用功能现已移至效果面板,具体位于实时指标数据分析边栏标签页布局偏移轨道中。因此,此版本弃用了性能数据分析面板,并将其从开发者工具中移除。

开发者工具团队非常感谢您就此面板的弃用以及整体性能调试体验提供反馈。一如既往,我们非常期待听到您的想法和看法。请继续提供反馈!

其他亮点

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

  • 效果
    • 移除了对搜索查询的 3 个字符限制。
    • 添加了 Home 按钮,可将您返回到实时指标页面。
    • 修复了之前无法使用的 Shift+S/W 轨迹缩放快捷键。
  • 元素 > 样式
  • 网络:预提取失败现在显示为黄色警告,而不是红色错误,以指明内容显示不受影响 372055494

下载预览渠道

不妨考虑将 Chrome Canary 版开发者版Beta 版用作默认开发浏览器。通过这些预览版渠道,您可以使用最新的 DevTools 功能、测试尖端的 Web 平台 API,并帮助您在用户发现问题之前发现网站上的问题!

与 Chrome DevTools 团队联系

您可以使用以下选项讨论与 DevTools 相关的新功能、更新或任何其他内容。

开发者工具的新变化

DevTools 新变化系列中涵盖的所有内容的列表。