此页面由 Cloud Translation API 翻译。

开发者工具的新变化 (Chrome 61)

Kayce Basques

Chrome 61 中的开发者工具即将发布的新功能和重大更改包括：

移动设备节流模拟。同时设置 CPU 和网络限制，以模拟中端或低端移动设备。
存储空间用量。按技术（IndexedDB、缓存、本地、会话等）查看源站目前的存储空间用量。
缓存时间戳。查看 Service Worker 缓存响应的时间。
从命令菜单启用 FPS 计量器。
在“性能”面板中更改鼠标滚轮和触控板行为。
以原生方式调试 ES6 模块。

注意：您可以访问 chrome://version，检查您运行的 Chrome 版本。Chrome 大约每 6 周会自动更新到新的主要版本。

查看下方这些版本说明的视频版本，或继续阅读以了解详情。

在 Device Mode 下模拟低端和中端移动设备

现在，系统会默认显示 Device Mode Throttling 菜单，只需点击几下即可模拟低端或中端移动设备。

图 1. 限制菜单

图 2. 将鼠标悬停在节流菜单上或打开捕获设置菜单，即可查看中端移动设备和低端移动设备的定义

查看存储空间用量

应用面板的清除存储空间标签页中新增的使用情况部分会显示源站在此设备上使用了多少存储空间，以及该源站在此设备上的最大配额。

“使用情况”部分

图 3. 用量部分显示，https://airhorner.com 使用了 66.9KB（在源配额 15214MB 的配额中）

查看 Service Worker 缓存响应的时间

Cache Storage 标签页中新的缓存时间列显示了 Service Worker 缓存响应的时间。

“缓存时间”列

图 4. 缓存时间列

从命令菜单启用 FPS 计量器

现在，您可以通过命令菜单启用 FPS 计量器。

从命令菜单启用 FPS 计量器

图 5. 通过命令菜单启用 FPS 计量器

通过性能记录设置鼠标滚轮行为以执行缩放或滚动操作

打开设置，然后设置新的 Flamechart 鼠标滚轮操作设置，以更改鼠标滚轮在 Performance 面板中的行为方式。

例如，当您在记录的 Main 部分使用鼠标滚轮时，或在触控板上用两根手指滑动时，默认行为是放大或缩小。当您将设置更改为滚动时，此手势现在会向上或向下滚动。

“Flamechart 鼠标滚轮操作”设置

图 6. Flamechart 鼠标滚轮操作设置

针对 ES6 模块的调试支持

ES6 模块以原生方式随 Chrome 61 一起提供。除了按照您的预期进行调试外，此处没有关于开发者工具的更多内容。不妨尝试设置一些断点，并逐步执行 TodoMVC 的 Paul Ireland 提供的 ES6-Module-implementation 实现。

下载预览渠道

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

与 Chrome 开发者工具团队联系

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

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