工欲善其事 必先利其器

搞懂你有哪些武器很重要

Agenda

• Element
• Console
• Source
• Network
• Animations
• Remote Device

Element

Element

• Computed - https://goo.gl/EngGuw
• Event Listeners - https://goo.gl/oln3U6
• DOM breakpoint - https://goo.gl/wO6Zru
• Properties

Console

Console

• $(), $$(), $0~$4
• debugger
• iframe console - https://goo.gl/uo3BTZ 
• copy
• inspect

Source

Source

• Breakpoint condition
• Snippets
• Blockboxing
• Async - https://goo.gl/P6bjHp
• sourceMap - https://goo.gl/lWGd5o
• Pause on exceptions

Network

Network

• offline & speed limits
• Headers
• Capture screenshots

Animations

Animations

• css3

Remote Device

Remote Device

• Genymotion
• Remote debug

Thank you for listening

Q & A