开发者工具的新变化,Chrome 126

Sofia Emelianova
Sofia Emelianova

性能面板改进

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

使用更新后的轨道配置模式移动和隐藏轨道

现在,右键点击轨道名称并选择配置轨道,即可进入轨道配置模式。移除了需要额外空间的修改按钮。

将修改按钮替换为菜单选项之前和之后。

在轨道配置模式下,您可以更改和隐藏轨道。点击 arrow_upward 向上或 arrow_downward 来移动曲目,或点击 visibility_off 来隐藏。如需退出配置模式,请点击底部的完成轨道配置

Chromium 问题:336266699

忽略火焰图中的脚本

Main 轨道中的火焰图添加了对忽略列表的支持。现在,您可以右键点击图表中的脚本,然后选择将脚本添加到忽略列表

用于添加要忽略的脚本列表、标记为已忽略的脚本以及“设置”中的相应规则的菜单选项。

图表会收起被忽略的脚本,将它们标记为在忽略列表中,然后将它们添加到设置 > 忽略列表下的自定义排除规则中。

Chromium 问题:336266714

将 CPU 限制降低 20 倍

性能面板的捕获设置中的 CPU 节流菜单新增了 20 倍减速选项。因此,您现在甚至可以更准确地重现和分析实际性能问题,即使是在高端计算机上也不例外。

将“20xSlowdonw”选项添加到“拍摄设置”之前和之后的对比。

Chromium 问题:324978881

“性能数据分析”面板将被弃用

实验性的“性能数据分析”面板将于 2024 年弃用。开发者工具团队正在努力将其最有用的功能集成到 Performance 面板中。现在,效果数据分析面板顶部会显示一个横幅,告知您即将弃用的功能。

“效果数据分析”面板中的弃用警告横幅。

如需了解详情,请参阅 2024 年及之后的性能工具

如果您对哪些方面做得不错,哪些方面需要改进,以及您认为在哪些方面需要改进,欢迎提供反馈,我们期待您的反馈

使用堆快照中的新过滤器查找过多的内存用量

Memory 面板中的堆快照中新增了过滤条件,可帮助您查找内存使用效率低下的常见情况,例如字符串重复、已分离的 DOM 节点保留的对象和开发者工具 控制台

针对常见的内存使用效率低下情况添加过滤条件选项之前和之后的情况。

Chromium 问题:337094903

在“应用”>“存储”中检查存储分区

您现在可以在应用 > 存储部分检查专用树中的存储分区。这种树之前为实验性功能,现已默认处于启用状态。

在“存储”部分启用存储分区树之前和之后。

Chromium 问题:338094915

使用命令行标志停用自我 XSS 警告

如果您自动使用 Chrome 或以其他方式从命令行打开开发者工具进行调试,您经常需要停用每个新开发者工具会话中显示的自我 XSS 警告

控制台中的自我 xss 警告对话框。

现在,您可以通过将 --unsafely-disable-devtools-self-xss-warnings 命令行标志传递给 Chrome 来停用此对话框。

Chromium 问题:41491762

Lighthouse 12.0.0

Lighthouse 面板现在运行 Lighthouse 12.0.0。

此次更新带来了许多更改,包括移除 PWA 类别、重新设计搜索引擎优化 (SEO) 类别、弃用“总体节省”功能,以及进行新的审核和审核方面的更改。请参阅完整的更改列表

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

Chromium 问题:772558

其他亮点

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

  • 性能
    • 现在,慢速捕获设置(启用高级绘制插桩启用 CSS 选择器统计信息)会在下一个开发者工具会话中自动清除。
    • 现在,当您缩放火焰图和数据更改时,选择器统计信息标签页不会自动滚动到底部 (337999939)。
  • 替换项
    • 替换标头时,您现在可以粘贴包含标头名称和值的字符串,该字符串将在 : 处自动拆分 (330967147)。
    • 添加了针对标头字符串的验证检查 (337012362)。
    • 对于符合预期行为 (328210785) 的网址,系统已停用 chrome://- 网址的替换菜单选项和修改按钮。
  • 控制台:现在,仅当抽屉式导航栏中的控制台处于聚焦状态时,Ctrl+` 快捷键才会关闭(40875466328210785)。
  • 自动填充:修复了地址解析问题(335409093335409707)。
  • 无障碍功能:修复了针对已本地化字符串的屏幕阅读器语音播报 (324930007)。

下载预览渠道

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

与 Chrome 开发者工具团队联系

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

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

开发者工具的新变化

开发者工具的新变化系列涵盖所有内容的列表。

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 浏览器 111

Chrome 浏览器 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Chrome 入门指南

Chrome 浏览器 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 已取消

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59