The Art of Comments

I believe commenting code is important. Most of all, I believe commenting is misunderstood. I tweeted out the other day that “I hear conflicting opinions on whether or not you should write comments. But I get thank you’s from junior devs for writing them so I’ll continue.” The responses I received were varied, but what caught my eye was that for every person agreeing that commenting was necessary, they all had different reasons for believing this.

Commenting is a more nuanced thing than we give it credit for. There is no nomenclature for commenting (not that there should be) but lumping all comments together is an oversimplification. The example in this comic that was tweeted in response is true:

This is where I think a lot of the misconceptions of comments lie. The book Clean Code by Robert C. Martin talks about this: that comments shouldn’t be necessary because code should be self-documenting. That if you feel a comment is necessary, you should rewrite it to be more legible. I both agree and disagree with this. In the process of writing a comment, you can often find things that could be written better, but it’s not an either/or. I might still be able to rewrite that code to be more self-documenting and also write a comment as well, for the following reason:

Code can describe how, but it cannot explain why.

This isn’t a new concept, but it’s a common theme I notice in helpful comments that I have come across. The ability to communicate something that the code cannot, or cannot concisely.

All of that said, there is just not one right way or one reason to write a comment. In order to better learn, let’s dig into some of the many beneficial types of comments that might all serve a different purpose, followed by patterns we might want to avoid.

Good comments

What is the Why

Many examples of good comments can be housed under this category. Code explains what you’d like the computer to take action on. You’ll hear people talk about declarative code because it describes the logic precisely but without describing all of the steps like a recipe. It lets the computer do the heavy lifting. We could also write our comments to be a bit more declarative

/*
  We had to write this function because the browser 
  interprets that everything is a box
*/

This doesn’t describe what the code below it will do. It doesn’t describe the actions it will take. But if you found a more elegant way of rewriting this function, you could feel confident in doing so because your code is likely the solution to the same problem in a different way.

Because of this, less maintenance is required (we’ll dig more into this further on). If you found a better way to write this, you probably wouldn’t need to rewrite the comment. You could also quickly understand whether you could rewrite another section of code to make this function unnecessary without spending a long time parsing all the steps to make the whole.

Clarifying something that is not legible by regular human beings

When you look at a long line of regex, can you immediately grok what’s going on? If you can, you’re in the minority, and even if you can at this moment, you might not be able to next year. What about a browser hack? Have you ever seen this in your code?

.selector { [;property: value;]; }

what about

var isFF = /a/[-1]=='a';

The first one targets Chrome ≤ 28, Safari ≤ 7, Opera ≥ 14, the second one is Firefox versions 2-3. I have written code that needs something like this. In order to avoid another maintainer or a future me assuming I took some Salvia before heading to work that day, it’s great to tell people what the heck that’s for. Especially in preparation for a time when we don’t have to support that browser anymore, or the browser bug is fixed and we can remove it.

Something that is clear and legible to you is not necessarily clear to others

Who’s smart? We are! Who writes clean code? We do! We don’t have to comment, look how clear it is. The problem with this way of thinking is that we all have deeper knowledge in different areas. On small teams where people’s skillsets and expertise are more of a circle than a venn diagram, this is less of an issue than big groups that change teams or get junior devs or interns frequently. But I’d probably still make room for those newcomers or for future you. On bigger teams where there are junior engineers or even just engineers from all types of background, people might not outrightly tell you they need you to comment, but many of these people will also express gratitude when you do.

Comments like chapters of a book

If this very article was written as one big hunk rather than broken up into sections with whitespace and smaller headings, it would be harder to skim through. Maybe not all of what I’m saying applies to you. Commenting sections or pieces allows people to skip to a part most relevant to them. But alas! You say. We have functional programming, imports, and modules for this now.

It’s true! We break things down into smaller bits so that they are more manageable, and thank goodness for that. But even in smaller sections of code, you’ll necessarily come to a piece that has to be a bit longer. Being able quickly grasp what is relevant or a label for an area that’s a bit different can speed up productivity.

A guide to keep the logic straight while writing the code

This one is an interesting one! These are not the kind of comments you keep, and thus could also be found in the “bad patterns” section. Many times when I’m working on a bigger project with a lot of moving parts, breaking things up into the actions I’m going to take is extremely helpful. This could look like

// get the request from the server and give an error if it failed
// do x thing with that request
// format the data like so

Then I can easily focus on one thing at a time. But when left in your code as is, these comments can be screwy to read later. They’re so useful while you’re writing it but once you’re finished can merely be a duplication of what the code does, forcing the reader to read the same thing twice in two different ways. It doesn’t make them any less valuable to write, though.

My perfect-world suggestion would be to use these comments at the time of writing and then revisit them after. As you delete them, you could ask “does this do this in the most elegant and legible way possible?” “Is there another comment I might replace this with that will explain why this is necessary?” “What would I think is the most useful thing to express to future me or other from another mother?”

This is OK to refactor

Have you ever had a really aggressive product deadline? Perhaps you implemented a feature that you yourself disagreed with, or they told you it was “temporary” and “just an AB test so it doesn’t matter”. *Cue horror music* … and then it lived on… forever…

As embarrassing as it might be, writing comments like

// this isn't my best work, we had to get it in by the deadline

is rather helpful. As a maintainer, when I run across comments like this, I’ll save buckets of time trying to figure out what the heck is wrong with this person and envisioning ways I could sabotage their morning commute. I’ll immediately stop trying to figure out what parts of this code I should preserve and instead focus on what can be refactored. The only warning I’ll give is to try not to make this type of coding your fallback (we’ll discuss this in detail further on).

Commenting as a teaching tool

Are you a PHP shop that just was given a client that’s all Ruby? Maybe it’s totally standard Ruby but your team is in slightly over their heads. Are you writing a tutorial for someone? These are the limited examples for when writing out the how can be helpful. The person is literally learning on the spot and might not be able to just infer what it’s doing because they’ve never seen it before in their lives. Comment that sh*t. Learning is humbling enough without them having to ask you aloud what they could more easily learn on their own.

I StackOverflow’d the bejeezus outta this

Did you just copy paste a whole block of code from Stack Overflow and modify it to fit your needs? This isn’t a great practice but we’ve all been there. Something I’ve done that’s saved me in the past is to put the link to the post where I found it. But! Then we won’t get credit for that code! You might say. You’re optimizing for the wrong thing would be my answer.

Inevitably people have different coding styles and the author of the solution solved a problem in a different way than you would if you knew the area deeper. Why does this matter? Because later, you might be smarter. You might level up in this area and then you’ll spend less time scratching your head at why you wrote it that way, or learn from the other person’s approach. Plus, you can always look back at the post, and see if any new replies came in that shed more light on the subject. There might even be another, better answer later.

Bad Comments

Writing comments gets a bad wrap sometimes, and that’s because bad comments do indeed exist. Let’s talk about some things to avoid while writing them.

They just say what it’s already doing

John Papa made the accurate joke that this:

// if foo equals bar ...
If (foo === bar) { 

} // end if

is a big pain. Why? Because you’re actually reading everything twice in two different ways. It gives no more information, in fact, it makes you have to process things in two different formats, which is mental overhead rather than helpful. We’ve all written comments like this. Perhaps because we didn’t understand it well enough ourselves or we were overly worried about reading it later. For whatever the reason, it’s always good to take a step back and try to look at the code and comment from the perspective of someone reading it rather than you as the author, if you can.

It wasn’t maintained

Bad documentation can be worse than no documentation. There’s nothing more frustrating than coming across a block of code where the comment says something completely different than what’s expressed below. Worse than time-wasting, it’s misleading.

One solution to this is making sure that whatever code you are updating, you’re maintaining the comments as well. And certainly having less and only more meaningful comments makes this upkeep less arduous. But commenting and maintaining comments are all part of an engineer’s job. The comment is in your code, it is your job to work on it, even if it means deleting it.

If your comments are of good quality to begin with, and express why and not the how, you may find that this problem takes care of itself. For instance, if I write

// we need to FLIP this animation to be more performant in every browser

and refactor this code later to go from using getBoundingClientRect() to getBBox(), the comment still applies. The function exists for the same reason, but the details of how are what has changed.

You could have used a better name

I’ve definitely seen people write code (or done this myself) where the variable or functions names are one letter, and then comment what the thing is. This is a waste. We all hate typing, but if you are using a variable or function name repeatedly, I don’t want to scan up the whole document where you explained what the name itself could do. I get it, naming is hard. But some comments take the place of something that could easily be written more precisely.

The comments are an excuse for not writing the code better to begin with

This is the crux of the issue for a lot of people. If you are writing code that is haphazard, and leaning back on your comments to clarify, this means the comments are holding back your programming. This is a horse-behind-the-cart kind of scenario. Unfortunately, even as the author it’s not so easy to determine which is which.

We lie to ourselves in myriad ways. We might spend the time writing a comment that could be better spent making the code cleaner to begin with. We might also tell ourselves we don’t need to comment our code because our code is well-written, even if other people might not agree.

There are lazy crutches in both directions. Just do your best. Try not to rely on just one correct way and instead write your code, and then read it. Try to envision you are both the author and maintainer, or how that code might look to a younger you. What information would you need to be as productive as possible?

---

People tend to, lately, get on one side or the other of “whether you should write comments”, but I would argue that that conversation is not nuanced enough. Hopefully opening the floor to a deeper conversation about how to write meaningful comments bridges the gap.

Even so, it can be a lot to parse. Haha get it? Anyways, I’ll leave you with some (better) humor. A while back there was a Stack Overflow post about the best comments people have written or seen. You can definitely waste some time in here. Pretty funny stuff.