Brevity in Code.

9/10/17

I recently watched a video that I think is very insightful and as a new developer it was quite helpful. It’s titled Brevity and Visualization in Code. It was centered around writing clean and concise code. Things like, why write long functions when it can be concise with half the lines. Also, the speaker went into reasons for keeping code within the 80 characters limit. He said that over time a lot of developers have thrown that rule out because of the large monitors we have now. A developer might think: “well I can easily read a line of my code up to 120 characters because I have this awesome 32 inch display.” Ok that’s true, but what about your team members? What about your boss while they are traveling with a small laptop? The speaker made an interesting suggestion. He said, try reviewing your code on a different device, such as a tablet, just to see what it looks like for other developers. That was just a couple of the topics covered.

Sounds like an informative video, huh? I would love to link you to it, however it has since been removed from the user’s YT page. I don’t know why. I forget who the speaker was too. I will be on the hunt for it though, and when I find it I will try to archive it and link to it from a future post. I would like to be able to re-visit it along my coding journey.

That video actually made an impact on me. It opened my eyes and made me think. When I finished watching it I opened VS Code and looked for any option to somehow highlight character 80. I found a user setting for a vertical ruler. Here’s how:

  1. Open the Command Palette
  2. Enter in user settings and press enter
  3. Enter in ruler
  4. Edit the setting for “editor.rulers”
    1. I set mine to 75. In my own opinion, it isn’t a hard rule. It’s just a warning, and I have already noticed a difference in my code. As I’m approaching the ruler, I start looking for a graceful breakpoint to drop my code down to the next line. If there isn’t one, and I go a few characters past 80 I’m not going to lose sleep over it.
      1. When you encounter a webpage with a wall of text, spanning from left margin to right margin, how likely are you to read it? What if that text was placed into three columns? A little more likely in the latter scenario, I bet. It would be the same mindset for code review.

We want less code like this:
{company: "Ninja Coders", title: "Engineer", technologies: ["HTML", "CSS", "JavaScript", "React"]}

…and more of this:
{
company: "Ninja Coders",
title: "Engineer",
technologies: [
"HTML",
"CSS",
"JavaScript",
"React"
]
}

…right? WordPress doesn’t do a good job at indenting pseudo code, so that might not look good on your screen but you get what I’m trying to say.

Speaking of indenting, the presenter covered that as well. He was saying that we have become obsessed with lining everything up, to a point where we end up with really crazy indentations sometimes. It can actually back-fire and make it look more chaotic sometimes. He showed a few examples that he has seen over the years and discussed ideas about cleaning it up, so the code would be easier to interpret. This also lead to a discussion about comments and he showed some examples of code comments that had a bunch of asterisks around them. He said we usually dive into the code first, so why waste so much space on comments. It’s true, when I review someone’s code I usually try to figure out what is going on before I read the comments. It’s like when you get a new gadget- most people tinker with it before they read the instructions. Maybe we should focus on better naming conventions. Let the function or class name explain its purpose.

It was a really great video and I hope I can track it down!

Cheers to clean code

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s