Google大神分享Chrome开发者工具技巧

Chrome不仅仅是一款优秀的网页浏览器，Google的工程师们还为其打造了强大的开发者工具。来自Google的Ilya Grigorik为我们分享了如何使用Chrome开发者工具（DevTools）分析HTML网页加载的问题，介绍了很多实用技巧。

绚丽的网页PPT传送门：《Wait, DevTools could do THAT?》

什么是Chrome开发者工具（DevTools）？

随意打开一个网页，在任意处鼠标右键，点击“审查元素”（Inspect Element），在浏览器下方出现的东西就是。本质上Chrome开发者工具也是一个HTML页面，只是浮动在当前页面上。

PPT精彩的介绍了：

1. cmd-? 一秒变身键盘忍者，完全通过快捷键操纵
2. 设置里可以Disable cache，方便调试
3. 通过HAR，记录和导出网页加载的过程，保留下来分析
4. Chrome开发者工具还可以通过js自定义功能
5. 还可以自定义HTML代码的高亮颜色
6. 深度跟踪渲染时间

想不到吧？Chrome还可以做这些？速度收藏。