JavaScript Code Smells

In the past I’ve given presentations, recorded videos, and written blog posts about fixing common JavaScript and jQuery bugs. This is a good skill to have, but what about working code? Fixing broken code is important, but have you ever gotten into the situation where your code works, but it doesn’t feel quite right… maybe even smells?

“A code smell is a surface indication that usually corresponds to a deeper problem in the system” –CodeSmell by Martin Fowler

As we grow as developers we strive to write more maintainable code, but on our journey we often times don’t know what that looks like yet.

Your JavaScript may pass stardard JSHint rules, but that doesn’t mean it’s legit.

Most developers can smell brittle and fragile code a mile away, but it takes time and training to combat against these smells. Code smells scream to be refactored.

So, I’ve come up with a new presentation called JavaScript Code Smells to review various common smelly snippets of code and discuss techniques on how we can eliminate and protect against their pungent odors. The points introduced aren’t necessarily specific to JavaScript, but are cross-cutting concepts that can apply to other languages as well.

Video

The following video was recorded this year at FluentConf. This is the 30 minute version of the talk. The full talk is 60 minutes, but I don’t have a recording of that yet. All the content for the 60 minute version is contained in my slides if you are interested.

Types of Smells

The following are the types of smells that I cover throughout the presentation. The names are a bit odd, but I have a weird compulsion to alliterate at times :)

  • Convoluted Code Smell
  • Copy Paste Code Smell
  • Switch Statement Smell
  • The This Abyss Smell
  • Crisp Concatenation Smell
  • jQuery Inquiry
  • Temperamental Timer Smell
  • Repeat Reassign Smell
  • Inappropriate Intimacy Smell
  • Incessant Interaction Smell
  • Anonymous Algorithm Smell
  • Unconfirmed Code Smell
  • Two-Way Data Binding Smell

Slides

You can find the slides from the presentation online at elijahmanor.com/talks/js-smells

If you enjoyed this post, please consider sharing it with others via the following Twitter or Reddit buttons. Also, feel free to checkout my egghead.io profile page for addition free and subscription lessons, collections, and courses. As always, you can reach out to me on Twitter at @elijahmanor. Thanks and have a blessed day!

Reddit