DevTools 新功能(Chrome 107)

Published on

Translated to: English, Español, Português, 한국어, Pусский, 日本語

感谢 Jim Lim 提供的翻译。

有兴趣帮忙改进 DevTools 吗?请注册并参与 Google 用户体验调研

客制化 DevTools 的键盘快捷键

您现在可以在 DevTools 里客制化您喜爱的键盘快捷键。

点击设置 > 快捷键, 将鼠标悬停在命令上并点击编辑的钢笔图示来客制化键盘快捷键。您也可以创建组合键(a.k.a. 多键点击快捷键)。

客制化开发者工具 (DevTools) 的键盘快捷键。

Chromium 议题: 1335274, 174309

使用键盘快捷键对浅色与深色主题进行快速切换

您可以设置一个快捷键来快速切换浅色与深色主题。开发者工具 (Dev Tools) 没有为这个东走预设任何快捷键。 使用键盘快捷键对浅色与深色主题进行快速切换。

Chromium 议题: 1280398, 1226363

高亮内存检查器里的 C/C++ 对象

辨识围绕在一个对象字节中的网络组件记忆体是一个用户痛点,您必须知道对象的体积以及从对象启动的时候开始计算字节数。

有了这个新功能, 将帮助用户讲您指示网络组件记忆对象从围绕的记忆体中分离, 参看 延伸 - 为了C/C++ 纠错而发生的机器检查器 来学习更多的改善。

高亮记忆检查器里的C/C++对象。

Chromium 议题: 1336568

支持 HAR 导入的完整启动器(Initiator)的讯息

[HAR import] 的完整 启动器(Initiator) 讯息现在可以参见(/docs/devtools/network/reference/#save-as-har). 在之前的版本中, 网络 (Network) 界面只显示启动器(Initiator) 的部分导入讯息。

完整的启动器讯息将帮助开发者检索网络请求的源头并辨别和网络相关的问题。

导入 HAR 导入的完整启动器的资讯

Chromium 议题: 1343185

点击 Enter 后开始 DOM 搜索

您现在可以禁止 即输即搜 (Search as you type) 设置来启动点击 Enter 后开始DOM搜索。

在**元素 (Elements)**面板, 使用 ControlCommand + F 来打开搜索栏,每当您在搜索栏中输入一个字母, DOM 树会默认跳到第一个符合条件的元素。

对于经常使用搜索长语句的用户, 这个设定并不是很不理想。因为 DOM 树 可能会在用户输入时, 不断地跳跃搜寻 (e.g. //div[@id="example"]),造成不必要的动效。

DOM search.

打开 设置 (Settings) > 偏好设置 (Preferences) , 禁止 即输即搜 (Search as you type) , 更改设置后,搜索将会在您点击回车键后才开始。

Search as you type setting.

Chromium 议题: 1344526

align-content 的 CSS flexbox 属性中显示startend图标

在 **样式 (Styles)**边栏中, 点击 display: flexdisplay: inline-flex 旁边的图标打开 flexbox 编辑器。 您可以利用图标来编辑 align-content 属性的 startend

align-content 的 CSS flexbox 属性

Chromium 议题: 1139945

其他的更新

  • 控制台 (Console) 中显示正确的网页错误计数。在之前版本中, 网页错误计数并没有在清除控制台的讯息后被自动更新。(1343311)

下载 Chrome 预览版本

您可以考虑把 Chrome Canary 版, 开发者版(Dev)测试版(Beta) 设置为默认开发浏览器。这些预览版本能让你抢先体验处于 DevTools 开发阶段的新功能、测试最新的网络平台 API ,让您抢先在用户之前发现您网站上的问题!

联系 Chrome DevTools 团队

您可以透过一下渠道讨论这篇文章的新功能和改进,或一切关于 DevTools 的一切。

  • 提交建议或意见回馈:crbug.com.
  • 报告 DevTools 问题:打开 DevTools,按 更多选项图标   More   > 帮助 > 报告 DevTools 问题
  • 在推特上,发推文: @ChromeDevTools.
  • 在我们的 What's new in DevTools YouTube 视频底下留言。

更多 DevTools 的功能

欲查询完整的 DevTools 已发布的功能,请参考 What's New In DevTools 英文系列。以下是部分已翻译成中文的内容。

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Chrome 101

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Updated on 改进文章

We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.