Chrome Devtools是目前做web开发必备的工具，网上也有各种教程、文档教大家怎么使用，资源太多就不一一列举了，下面介绍几个我自己日常除了基础常用的功能外，额外会用到的技能。
Snippets
Snippets，中文直译为片段，可以理解为代码片段，主要功能是可以保存临时的代码片段，功能位于Sources--Snippets。
在Snippets面板写代码片段有三个好处：
- 可以临时保存，自己不删不会丢
- 代码有简单格式，换行、回车都支持
- 可以暂存多个代码片段，很方便
平时调试代码习惯使用Console面板，简单的代码，可以在Console处编辑，但是在这边编辑有个缺点就是格式不好控制，且关闭后代码就清除了，下次想再找就没办法了，因此推荐使用Snippets功能暂存临时代码片段。
Performance
该面板大家平时可能不大用，大多在分析性能的时候会用到，其中的每个子功能会使用的话都可以很多的进行性能分析，网上教程很多，可自行查阅。
Network
捕获网络请求必备。可以对当前的请求进行非常全面的分析，包括请求头信息、请求体信息、请求方式及返回。
同时，可以模拟断网状态，可以强制不使用缓存进行请求。通过分析请求的时间、大小，可以进行性能的分析。
Application
该面板用的比较多的可能是进行本地存储的管理、查看等，目前还支持编辑cookie。
实用快捷键
- Ctrl + F8 ，trigger 断点
- Ctrl + P ，查找文件
- Ctrl + Shift + F ， 全局搜索
- Ctrl + G ，定位某一行
- Ctrl + L ，清空console
- Ctrl + R ，强制刷新
☜☜☜ wechat 『『『 reward 点击扫码打赏 ~~~ ^_^ 』』』alipay ☞☞☞ 