八个主要工具：
Elements(元素)： 元素面板让你看到一个 DOM 树的全部相关信息，并允许你检查以及在传输过程中编辑 DOM 元素。也就是html和css.
Network（网络）: 网络面板提供了有关已经下载和加载过的资源的详细分析。在优化页面的基本过程中，确定和找到那些请求通常要比预计的时间更长。
Sources(源)： 文件路径。
Timeline(时间表)： 在加载和使用你的网页应用程序或网页时，时间轴面板给你关于时间开销的完整概述。包括从加载资源到解析 JavaScript，以及计算方式在内的所有事件，都 会重 新绘制在一个时间表中。
Profiles(配置)： 配置面板允许您为网络应用程序或页面配置执行时间和内存使用量。这些有助于你理解资源的消耗，以帮助你优化你的代码。
Resources(资源)：资源面板允许你监视页面中加载的资源。它可以让你使用 HTML5 的本地存储，数据库，缓存，appcache，等
Audits(审核)： 审计面板可以像加载页面时那样分析一个页面。然后提供关于减少页面加载时间的建议和优化，以此提高感知（和真实）的响应。要进一步的了解该功能，我们 推荐使用 pagespeed 。
Console(控制台)：
JavaScript 控制台为开发者提供了测试 Web 页面和应用程序两个主要功能,其中包括：
-
在开发过程中记录诊断信息。
- 一个可与文档和工具交互的 shell 提示符。
您可以使用控制台编程接口提供的方法来记录诊断信息。如 console.log() 或 console.profile()。