DEV Community

moayad khader
moayad khader

Posted on

When Async Keyword Becomes Evil

Async here and Async there, Just Async everywhere.

What could go wrong if I just added this innocent keyword in in function's definition that doesn't involve asynchronous operations ?

async function innocentFunction() {

    // No asynchronous operations here

    console.log("Just Relax It's Just a Keyword!");

}
Enter fullscreen mode Exit fullscreen mode

Well to answer this question , we need to know how event loop in JS is working.

The event loop allows JavaScript to be non-blocking and handle asynchronous operations efficiently.

In a nutshell, the event loop continuously checks the message queue for tasks. When a function is asynchronous, it can yield control back to the event loop while waiting for external resources or operations to complete. The event loop then picks up the next task from the queue.

Image description

The Unintended Consequences: Performance Overhead

When an async function doesn't involve any asynchronous operations, it still undergoes the process of creating a micro-task and being added to the end of the micro-task queue. This additional step introduces unnecessary overhead.

Image description

So, as more experienced Developer. how can you prevent this innocent mistake to affect your codebase.

Firstly, you have to embrace the issue and tell other developers about this evil .

Secondly, you can prevent this issue from happening by adding "require-await" rule in your eslint config.

Top comments (0)