概述

工欲利器事，必先利其器。当我们在调试、优化网页性能的时候，Google开发者工具真的可以给我们带来很大的帮助。

它主要分为如下几个模块：

1. 设备模式
2. 元素模板
3. 控制面板
4. 源代码面板
5. 网络面板
6. 性能面板
7. 内存面板
8. 应用面板
9. 安全面板

除了上面的面板还有下面的其它工具

coverage 工具

查看文件的使用比率。

Rendering 工具

Paint flashing

Layer borders

FPS meter

Scrolling performance issues

模拟媒体查询

目前有三个选项：

1. No emulation，不使用媒体查询
2. print，打印机
3. screen，屏幕

使用 DevTools 的工作区设置持久化

参考

Google Devtools
使用 DevTools 的工作区设置持久化