https://developers.google.com/chrome-developer-tools/docs/tips-and-tricks
1、console面板多行输入
Shift + Enter 可以换行，而不是执行代码
2、Ctrl + Shift + C 可以直接进入审查元素的模式
3、Ctrl + L 清除console历史
4、选择页面上面的一个元素，然后在console里面输入$0，这个元素就可以被脚本使用了，如果页面用了jquery那就使用$($0)
5、使用XPath
$x(xpath) 来选择节点 $x('//img'):However, the function also accepts an optional second argument for the path context - i.e $x(xpath, context). This lets us select a specific context (e.g an iframe) and run an XPath query against it.
var frame = document.getElementsByTagName('iframe')[0].contentWindow.document.body;
$x('//'img, frame);
which queries the images within the specified iframe.
6、console.dir(object) 可以查看某个对象所有的属性
7、console.time() 和 console.timeEnd() 用来计算时间
8、在timeline里面，如果看到有黄色带感叹号的三角形，意味着你的代码触发了 强制/同步 的布局事件，这些事件对页面性能有明显影响（回流）
更多关于 console
console.warn("1") console.error("1") console.info("1") 只是输入icon不同
console.assert(false, "My assertion always fails");
类似于单元测试中的断言，当前面的表达式为 false 的时候，输出后面的信息
console.count 用来统计被执行了多少次
Profiles 面板选中Collect JavaScript CPU Profile，点击开始然后刷新页面点击停止
1、Bottom Up视图按照函数对性能影响排序
2、Top Down视图反应调用栈性能
切换成chart视图之后，横坐标表示的是时间，竖坐标表示的是调用栈（call stack），对性能消耗大的图片越宽，因此重点关注很宽的图片，不管他们在调用栈里的高低
