Avoid The Pyramid Of Doom

Avoid The Pyramid Of Doom

In computer programming, the pyramid of doom is a common problem that arises when a ... Promises, a technique for avoiding the pyramid of doom, e.g. used in JavaScript; Law of Demeter · Safe navigation operator, a programming language ...

Often, when I look at code written by juniors, I see a lot of nested code. In this article, I’ll try to articulate why it is problematic and what to do instead.

A trivial illustration of the issue

Let’s look at a trivial example together:

This function is simple enough; it either receives an input, or it does not. As it stands, almost all of the code of this function is “protected” by an if statement. That is, almost none of the code will execute if the condition is not met. If it isn’t, then there’s a single log statement to execute.

For such a simple function, this isn’t a big issue, but it is an issue nevertheless. Why?

The fundamental issue

Functions such as the previous one are problematic because they nest code that doesn’t need to be nested. Nested code is harder to read/understand.

Whenever you have the opportunity to remove needless nesting, do it, you’ll reduce the complexity of the code.

There’san interesting code quality metric called Cyclomatic Complexity that evaluates the complexity of a program based on the control flow graph. If there are no conditional statements / decision points, then the complexity is “1”, since there’s a single path through the code.

If there’s an if, then there are now two different paths and the complexity rises to “2”. And if there’s a conditional statement or decision point within that if, then the complexity goes up to “3”, etc.

So, fundamentally, the idea is that the less “nesting” there is, the less complex the code is. And, to me, less complex code is almost _always _a win, whether a function is small/simple or not.

The example that I gave may be trivial, but the principle already applies. The more complex parts of a codebase will certainly have two levels of nesting or more, leading to the infamous pyramid of doom. The same happens when you chain callbacks for example, so there are different occurrences of the same basic issue: as nesting levels increase, so does the complexity.

So what can we change to reduce the complexity of such code?

Tip: Both [TSLint_](https://palantir.github.io/tslint/rules/cyclomatic-complexity/) and [ESLint_](https://eslint.org/docs/rules/complexity)_ have built-in rules that can check the cyclomatic complexity of your code, so make sure that those are enabled._

typescript javascript web-development coding programming

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

What is TypeScript? Why TypeScript? and Why Not TypeScript?

TypeScript extends JavaScript by adding Types. There are many great reasons to switch to TypeScript. Especially if your team uses JavaScript. There are some reasons to not use TypeScript as there are with any language or framework.

Why Web Development is Important for your Business

With the rapid development in technology, the old ways to do business have changed completely. A lot more advanced and developed ways are ...

Important Reasons to Hire a Professional Web Development Company

    You name the business and I will tell you how web development can help you promote your business. If it is a startup or you seeking some...

13 Useful JavaScript Developer Tools for Writing High-Quality Code

Today I’m going to show you 13 well-know and popular tools to write better and cleaner JavaScript code. These are tools that I’m using right now on my JavaScript developer journey. So if you want to improve the quality of your projects, this list is for you.

6 Ways to Practice Your Coding Skills and Grow Your Career as a JavaScript Developer

6 min read ... Some of the highest-paid JavaScript developers make close to $500k/year ... actually need to learn many languages in the course of their career to ... Learn concepts professional developers need to advance their careers ...