Asynchronous vs Synchronous Programming

One of the topics that might seem a bit complex for beginner and even intermediate programmers is the crucial difference between Synchronous and Asynchronous programming. If you are confused by the abstract definitions and searching for a simpler explanation, well, then you are on the correct page. In this blog, I want to help you out with how to distinguish between those two.

Real-Life Example

Given the above situation, your brain naturally thinks of how can the tasks be ordered. You probably can imagine that there are many possible ways you could complete all of the friends’ requests, but let’s overview the Synchronous and Asynchronous approaches.

Synchronous Approach

Fig 1. Completing tasks using Synchronous Approach

As you can see in Fig.1 we’ve completed the tasks successfully and everyone is happy, Yayyy! But wait, How much time did we waste just being idle and waiting for the water to boil or for the pizza to cook in the oven? Probably a lot and that’s why Adam is a bit frustrated that you made him wait for so long to get his T-shirt. Can we improve and be more efficient? Stop reading the post and think of the way you could decrease the completion time of all three tasks. How would you complete those tasks?

Well, if you thought about parallelizing the tasks, then probably you are smart and in a correct way of thinking. In the next section, we’ll explain the more efficient way of doing those tasks, which will save us lots of time to communicate with our friends and not just wait for no reason! :)

Asynchronous Approach

Fig 2. Completing tasks using Asynchronous Approach

As you can observe above, we didn’t wait for each of the tasks to finish, we did it parallelly. Let’s generalize this approach and move on to the programming part.

Programming Example

let Instruction1 = () =>{// Do Something...console.log('Executed 1st instruction')}
let Instruction2 = () =>{// Do Something...console.log('Executed 2nd instruction')}
let Instruction3 = () =>{// Do Something...console.log('Executed 3rd instruction')}

Note: We are using Node.js for the demonstration. If you are willing to use it in your applications, I’d suggest you visit the documentation and familiarize yourself more with it.

If we execute those instructions Synchronously, the program will just run through all of the instructions and completely finish them by the order it was provided:

Instruction1()Instruction2()Instruction3()--------------
Output:
Executed 1st instruction
Executed 2nd instruction
Executed 3rd instruction

Now let’s add an Asynchronous function to the second instruction and examine the output of the program:

Instruction1()setTimeout(() => {Instruction2()}, 0)Instruction3()--------------
Output:
Executed 1st instruction
Executed 3rd instruction
Executed 2nd instruction

Note: function SetTimeout() is Asynchronous by default in Node.js. If you want to learn more about it, please visit the link.

What happened? Despite the timeout delay is 0 seconds, the compiler firstly executes the 3rd instruction and then the 2nd one. That’s because the instructions are completed in parallel and before executing the 2nd instruction the last one is awaited.

Hope the blog was helpful for you. When you try to start a new project remember the 3 things: “Make it work, make it right, make it fast.”, and don’t forget about the third component! Good luck! :)