크롬 개발자 도구

1. 손발이 편한
크롬 개발자 도구
전용우

2. about.me/mixed

3. TOC
• Event Listener
• DOM Monitoring
• Dynamic Script Edit
• Timeline

4. Event Listener

5. 엘리먼트에
할당된 이벤트를
알고 싶을 때

9. before
• 엘리먼트를 찾기
• 소스코드에서 해당 아이디 찾기

10. after

12. DOM Monitoring

13. 특정 엘리먼트가
변경되는 시점에
디버깅

15. before
• 엘리먼트를 찾기
• 소스코드에서 해당 아이디 찾기

16. after

18. Dynamic Script Edit

19. 코드 수정하면서
디버깅 할 때

21. before
• 코드 수정 -> refresh -> 코드 수정 ....

22. after

24. Timeline

25. 성능 개선할 때

26. DOM Network

27. Reflow