Reading Code
ArnhemJUG - August 31st, 2023
https://maritvandijk.com/
Slide 2
Slide 2 text
Reading Code
Introduction
• We spend more time reading code than writing code
Slide 3
Slide 3 text
Reading Code
Introduction
"developers on average spend as much as 58% of their time comprehending
existing source code" -
Felienne Hermans,
The Programmer's Brain
Slide 4
Slide 4 text
Reading Code
Introduction
We read code when:
• onboarding to a new project
• adding or changing functionality
•
fi
xing bugs
• doing code reviews
• reading books, blogs, ...
• etc.
Slide 5
Slide 5 text
Reading Code
Introduction
• We spend more time reading code than writing code
• But we don't practice reading code explicitly (much)
Slide 6
Slide 6 text
Reading Code
Introduction
• What if we practice reading code explicitly?
Slide 7
Slide 7 text
Reading Code
Introduction
• Code Reading Club
https://codereading.club/
Slide 8
Slide 8 text
Reading Code
Introduction
• Fragment of code (outside an IDE)
• Structured exercises
Slide 9
Slide 9 text
Reading Code
Introduction
• So many insights!
Slide 10
Slide 10 text
Reading Code
Introduction
• But what about the IDE?
Slide 11
Slide 11 text
Reading Code
Introduction
• Di
ff
erent strategies / approaches for di
ff
erent tasks
• With & without your IDE
Slide 12
Slide 12 text
Reading Code
Agenda
• The bigger picture
• Understanding a codebase
• and it's context
• Down to the details
• Find a place to start
• Search
• Navigate from there
• Understanding a speci
fi
c piece of code
• Hints from your IDE
• Exercises for deliberate practice
Slide 13
Slide 13 text
Reading Code
Introduction
• Focus:
• Reading to understand
• Not to judge
Slide 14
Slide 14 text
Reading Code
The bigger picture
Slide 15
Slide 15 text
Reading Code
The bigger picture
• Onboarding to a new team / code base
Slide 16
Slide 16 text
Reading Code
The bigger picture
• What does the code do?
Slide 17
Slide 17 text
Reading Code
The bigger picture
• What is the context?
Slide 18
Slide 18 text
Reading Code
The bigger picture
• Background knowledge
• Business domain
• Programming domain
Slide 19
Slide 19 text
Reading Code
The bigger picture
• Read the documentation!
• Do some research
Slide 20
Slide 20 text
Reading Code
The bigger picture
Strategies:
• Identify components
• Identify relationships / dependencies
• Gain background knowledge
Slide 21
Slide 21 text
Reading Code
The bigger picture
• Take notes!
Slide 22
Slide 22 text
Reading Code
The bigger picture
But
fi
rst:
• Check out the code
• See if you can build it
Slide 23
Slide 23 text
Demo time
Slide 24
Slide 24 text
Reading Code
The bigger picture
• Draw your own diagrams
• Write down questions
• Write down suggestions (maybe)
Slide 25
Slide 25 text
Reading Code
The bigger picture
Science:
• Chunking
Slide 26
Slide 26 text
Reading Code
Down to the details
Slide 27
Slide 27 text
Reading Code
Down to the details
• Find a starting point
Slide 28
Slide 28 text
Reading Code
Down to the details
• Search
Slide 29
Slide 29 text
Reading Code
Down to the details
• Navigate
Slide 30
Slide 30 text
Demo time
Slide 31
Slide 31 text
Reading Code
Down to the details
• Draw your own diagrams
• Write down questions
• Write down suggestions (maybe)
Slide 32
Slide 32 text
Reading Code
Understanding a piece of code
Slide 33
Slide 33 text
No content
Slide 34
Slide 34 text
Reading Code
Understanding a piece of code
• Exercises
Slide 35
Slide 35 text
Reading Code
Understanding a piece of code
• Your IDE can help!
Slide 36
Slide 36 text
Reading Code
Understanding a piece of code
• Structure
Slide 37
Slide 37 text
Reading Code
Understanding a piece of code
• Restructure
Slide 38
Slide 38 text
Reading Code
Understanding a piece of code
• Behavior
Slide 39
Slide 39 text
Reading Code
Understanding a piece of code
• Context
Slide 40
Slide 40 text
Demo time
Slide 41
Slide 41 text
Reading Code
Next steps
• What's next?
Slide 42
Slide 42 text
Reading code
Slides & More
https://maritvandijk.com/presentations/reading-code/