DEV Community

Cover image for Compact vs Readable Code
El Marshall (she/they)
El Marshall (she/they)

Posted on

3

Compact vs Readable Code

Happy Friday everyone! I'm gonna be honest y'all, I'm picking up a new cat today so my focus is not the best. His name is Bumble Bee and he's the cutest:

picture of a medium haired black cat sitting amongst many toys and looking up with very wide eyes

So in light of this, we're going to wait to do part VI of the binary tree series, since I don't have time to do thorough research. Have a bit of an opinion piece instead!

This week I was sent an interesting interpretation of the classic FizzBuzz challenge. For those who do not know, FizzBuzz is a classic algorithm challenge, that goes like so:

Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”.

This article provides an extremely concise means of solving the problem:

for(let i=0;i<100;)console.log((++i%3?'':'fizz')+(i%5?'':'buzz')||i)

It then runs through exactly what's going on there, because frankly it is a pretty intimidating looking jumble of code. But the feather in its cap here is just how short it is. You could say that it is extremely simple, since it uses only one line of code.

On the other hand, if you define simplicity around readability, I would consider it very complex. A more traditional, but longer, solution looks like this (as provided in the same article):

for (var i=1; i < 101; i++){
    if (i % 15 == 0) console.log("FizzBuzz");
    else if (i % 3 == 0) console.log("Fizz");
    else if (i % 5 == 0) console.log("Buzz");
    else console.log(i);
}

This code is much more readable, as a human. If this, do this, else if this do this, and so on. More lines of code are used, but it allows for much more approachable code.

Some will tell you that the best code is code that uses as few lines as possible.

Some will tell you that the best code is code that is readable.

While I certainly agree that you should make sure your code is tight, concise, not bloated, etc, I do not think that that should be taken so far as to sacrifice readability. If I'm new to your code, I should be able to walk in and understand what's going on easily.

So far as I can tell, there is no performance difference between the above two samples of code, or if there is one it's negligible (if someone reads this and does know a difference please let me know, I'd be super curious to see where the difference lies! That's an area I'm still growing my knowledge). Given that, I'll take the readable version any day.

I really enjoyed getting to see this - I learned something new about console.log and the || operator for one, and it was a neat thought experiment to see how this solution could be distilled down.

Still, at the end of the day, I think I'll stick to my ifs and switches!

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay