The document is a comprehensive guide on effective debugging, emphasizing that it is one of the most crucial skills for programmers. It outlines a systematic approach to debugging, including gathering information, replicating issues, identifying culprits, fixing them, and mitigating future occurrences. Additionally, the document discusses essential tools and techniques, encouraging programmers to be methodical and persistent in their debugging efforts.

1. Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe
Debugging Effectively
Colin O’Dell
@colinodell

2. Colin O’Dell
• Lead Web Developer at Unleashed Technologies
• PHP developer since 2002
• PHP League Member
• league/commonmark
• league/html-to-markdown
• PHP 7 Upgrade Guide e-book
• @colinodell / www.colinodell.com
Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe

3. Overview
I. Importance of debugging
II. Debugging process
III. Tools & Techniques
IV. Q&A
Photo by Roman Boed // cc by 2.0 // https://flic.kr/p/ngwcf1

4. Debugging is...
Photo by Ewan Cross // cc by-nc-nd 2.0 // https://flic.kr/p/7MCt3m
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
(adjective)

5. Debugging is...
important
Photo by Ewan Cross // cc by-nc-nd 2.0 // https://flic.kr/p/7MCt3m

6. Debugging is...
the single most
important skill in
programming.
Photo by Ewan Cross // cc by-nc-nd 2.0 // https://flic.kr/p/7MCt3m

7. PlanningCoding
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

8. Planning
Testing &
Debugging
Coding
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

9. Debugging is the process of finding and
resolving bugs or defects that prevent correct
operation of computer software or a system.
– Wikipedia
Photo by Stephen Dyrgas // cc by-nc-nd 2.0 // https://flic.kr/p/3eTfWU

10. Process is the foundation of effective
debugging
Process
Photo by Matthew Paulson // cc by-nc-nd 2.0 // https://flic.kr/p/di35xa

11. Photo by Matthew Paulson // cc by-nc-nd 2.0 // https://flic.kr/p/di35xa
Gain experience with tools and code
Experience
Process

12. Photo by Matthew Paulson // cc by-nc-nd 2.0 // https://flic.kr/p/di35xa
Develop a “sixth sense”
“Sixth Sense”
Experience
Process

13. Junior Developers
• Try the “usual” steps
• app/console cache:clear
• composer install
• chmod –R 777 *
• Google the error
• Try every solution
• Ask somebody else
• Co-worker
• StackOverflow post
• Give up
Photo by Yoel Ben-Avraham, with changes // cc by--nd 2.0 // https://flic.kr/p/6pmtQL

14. XY Problem
•I want to solve problem X
•How do I solve X?
Photo by Yoel Ben-Avraham, with changes // cc by--nd 2.0 // https://flic.kr/p/6pmtQL

15. XY Problem
•I want to solve problem X
•How do I solve X?
•Solution Y might work
•How can I do Y?
Photo by Yoel Ben-Avraham, with changes // cc by--nd 2.0 // https://flic.kr/p/6pmtQL

16. Photo by quattrostagioni // cc by 2.0 // https://flic.kr/p/aGjVq8
1.Don’t parse HTML with regex
2.Solve problems the right way

17. “I don’t know why”
“For some reason”
“Doesn’t make sense”
Photo by Stanley Yuu // cc by-nc-nd 2.0 // https://flic.kr/p/pMnfNu

18. Bugs are
logical
Photo by Photofest

19. “The bug is not moving around in
your code, trying to trick or evade
you. It is just siting in one place,
doing the wrong thing in the same
way every time.”
– Nick Parlante, Debugging Zen
Photo by GrahamC57 // cc by-nc-nd 2.0 // https://flic.kr/p/cwJi9Q

20. Assume your
code is the
problem
Photo by Sergio Flores Rosales // cc by-nc-nd 2.0 // https://flic.kr/p/5UHkaW

21. Systematic Approach
1. Gather information
2. Replicate the issue
3. Identify the culprit
4. Fix it & re-test
5. Mitigate future occurrences
Photo from EduSpiral // cc by-nc-nd 3.0

22. •Expected behavior
vs. actual behavior
•Error messages
•Stack traces
Photo from youmustdesireit.wordpress.com
•Screenshots
•Browser & OS
•Date & time
•Log entries
1. Gather Information

23. 2. Replicate the Issue
Be able to replicate with 100% certainty
Photo by Nick Royer // cc by-sa // https://flic.kr/p/d41ASC

24. • Be methodical
• Make no assumptions
• Understand the bug
Photo by U.S. Navy // cc 2.0 // https://flic.kr/p/n6Wgks
3. Identify the Culprit

25. • Attempt to replicate again
• Avoid XY problem
• No temporary workarounds!
• Add technical debt
• May introduce other issues
• Never get replaced with true solutions
Photo by Jeff Eaton // cc by-sa 2.0 // https://flic.kr/p/b33rSx
4. Fix & Re-test

26. 5. Mitigate Future Occurrences
•Add an automated test
•Share your new knowledge
• Project documentation
• Blog post
• StackOverflow
•Submit patch upstream
Photo by marcokalmann // cc by-nc-nd 2.0 // https://flic.kr/p/4CqLMQ

27. Recap
1. Gather information
2. Replicate the issue
3. Identify the culprit
4. Fix it & re-test
5. Mitigate future occurrences
Photo from EduSpiral // cc by-nc-nd 3.0

28. Long-Term Results
• Gain experience
• Learn how the system works
• Build heuristics
• Boost confidence
Photo by Glenn Beltz // cc by 2.0 // https://flic.kr/p/i7Csdx

29. Tools &Techniques
Photo by Alan // cc by-nc-sa 2.0 // https://flic.kr/p/9azLii

30. Two essential tools
• Integrated development
environment (IDE)
• Interactive debugger
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

31. Integrated Development
Environment
• Minimum features:
• Syntax highlighting
• Auto-completion
• Fast code navigation
• Debugger
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

32. Interactive Debugger
• Pause code execution
• Breakpoints
• Conditional breakpoints
• Step through execution
• Examine variables
• Explore call stack
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

33. Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC

34. Techniques
1. Trace backwards from known issue
2. Divide & conquer
3. Use tools
4. Get help
5. Take a break
Photo by Massmo Relsig // cc by-nc-nd 2.0 // https://flic.kr/p/pFrJCe

35. 1. Trace backwards
•Use a debugger
•Identify source of error
•Establish context
•Work backwards
Photo by Shawn Harquail // cc by-nc 2.0 // https://flic.kr/p/npxFVw

36. 1. Trace backwards
a()
b()
c()
d()
Photo by Shawn Harquail // cc by-nc 2.0 // https://flic.kr/p/npxFVw

37. 1. Trace backwards
a()
b()
c()
d()
Photo by Shawn Harquail // cc by-nc 2.0 // https://flic.kr/p/npxFVw

38. 2. Divide & Conquer
• Identify different code sections
• Set breakpoints at the boundaries
• Isolate issue to one particular area
• Focus efforts on that area

42. ✓
X

44. 3. Use tools
• VarDumper
• Debug toolbars
• Console utility
• Profilers
• git bisect
Photo by florianric // cc by 2.0 // https://flic.kr/p/c4QJzC
•netcat
•curl
•strace
•etc.

45. VarDumper
Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe
Twig:
{{ dump(foo) }}
{% dump foo %}
PHP:
dump($somevar);

46. Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe
Debug toolbars

47. Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe
Console Utility
Symfony: bin/console
Drupal: drush
Drupal Console
Magento: n98-magerun
Laravel: artisan

48. Performance Profiling
Identify slowness:
• Bottlenecks
• Resource hogs
• Inefficient code
Photo by Alan Stark // cc by-sa 2.0 // https://flic.kr/p/dn3qjx
Tools:
• Blackfire (freemium)
• New Relic (freemium)
• xhprof (open-source)

49. git bisect
v1.7 ? ? ? ? ? HEAD
Photo by unbekannt270 // cc by 2.0 // https://flic.kr/p/oHReqm

50. git bisect
v1.7 ? ? BAD ? ? HEAD
Photo by unbekannt270 // cc by 2.0 // https://flic.kr/p/oHReqm

51. git bisect
v1.7 ? ? BAD BAD BAD HEAD
Photo by unbekannt270 // cc by 2.0 // https://flic.kr/p/oHReqm

52. git bisect
v1.7 GOOD ? BAD BAD BAD HEAD
Photo by unbekannt270 // cc by 2.0 // https://flic.kr/p/oHReqm

53. git bisect
v1.7 GOOD
X BAD BAD BAD HEAD
Photo by unbekannt270 // cc by 2.0 // https://flic.kr/p/oHReqm
abcd123 is the first bad commit

54. netcat
Photo by Joseph B // cc by-nc-nd 2.0 // https://flic.kr/p/7GAMBe

55. 4. Get help
•RTFM / RTFD
•Project forums or issue queue
•StackOverflow, IRC, etc.
•Ask a colleague
• Expert in that area
• Senior developer
•Rubber ducking
Photo by Hiromitsu Morimoto // cc by-sa 2.0 // https://flic.kr/p/6Vzzaa

56. 5. Take a break
• Clear your mind; start fresh
• Forget invalid assumptions
• Recharge your batteries
• Let your subconscious work on it
Photo by Kristina Alexadnerson // cc by-nc-nd 2.0 // https://flic.kr/p/cFEcDC

57. Four things to walk away with
1. Computers aren’t random,
and neither are bugs
2. Persistence will always pay off
3. Don’t be afraid to dive deep
4. Don’t make assumptions or
take things for granted
Photo by Kristina Alexadnerson // cc by-nc-nd 2.0 // https://flic.kr/p/dvEpfY

58. Questions?
Photo by Marcello Maria Perongini // cc by-nc-nd 2.0 // https://flic.kr/p/6KDtm

59. Learn More
• https://web.duke.edu/cps001/notes/Debugging.pdf
• http://www.fiveminutegeekshow.com/20
• http://blog.codeunion.io/2014/09/03/teaching-novices-how-to-
debug-code/
• https://www.jetbrains.com/phpstorm/help/debugging.html
• http://symfony.com/doc/current/components/var_dumper/introducti
on.html
• http://www.sitepoint.com/debugging-git-blame-bisect/
• http://unix.stackexchange.com/a/50099/80744
• http://codeception.com/docs/01-Introduction
• http://chadfowler.com/blog/2014/01/26/the-magic-of-strace/
• http://c2.com/cgi/wiki?RubberDucking
Photo by Samantha Marx // cc by 2.0 // https://flic.kr/p/8KrU1R

60. Thanks!
Photo by Steve Rotman // cc by-nc-nd 2.0 // https://flic.kr/p/xiBK