Let your code breathe

Matthew Morrison,July 28, 2025•1 min read

Do you ever look at code and think “wow this is ugly”. Same, we’ve all been there. In this blog post, I want to discuss one of my pet peeves. Bunched together code. Rather than trying to explain this with words, let me show you. This is my top level function for my snake game, except I smashed it all together.


setHighScore(getHighScore());
initButtons();
const root = document.getElementById('root');
assert(root, 'Cannot find root node');
const grid = initGrid(root);
const playButton = document.getElementById('play-button');
assert(playButton, 'Cannot find play button');
playButton.addEventListener('click', () => run(initGameState(grid)));

Yuck! Oh my eyes. This is an example where I think you should let your code “breathe”. Separate it out into logical chunks to break it up.


setHighScore(getHighScore());
initButtons();
 
const root = document.getElementById('root');
assert(root, 'Cannot find root node');
 
const grid = initGrid(root);
 
const playButton = document.getElementById('play-button');
assert(playButton, 'Cannot find play button');
 
playButton.addEventListener('click', () => run(initGameState(grid)));

Ah, much better.

This of course is just my humble and honest opinion but, I’m curious if others feel passionate about this like me. Thanks for reading and remember to let your code breathe!