Synchronous vs Asynchronous in Web dev
Table of Contents
What the heck is synchronous and asynchronous request?
Synchronous and asynchronous requests are two distinct approaches to how a client interacts with a server. They are not only related to web development; they are widely used in different areas (such as operating systems). In this article, I will be focusing only on the context of web development.
Synchronous requests
In synchronous communication, the client (e.g., a web browser) sends a request to the server,which then gets blocked waiting for the response. During this time, the client is idle and can’t proceed with any other task, making it less efficient. A very simple example of a synchronous blocking function is the Javascirpt alert function. If you execute this function alert("Hello Aly") in the console, you will notice that the browser has become unresponsive, and you cannot do anything other than deal with the alert. Synchronous and asynchronous requests are two distinct approaches to how a client interacts with a server. They are not only related to web development; they are widely used in different areas (such as operating systems). In this article, I will be focusing only on the context of web development.
Asynchronous requests
Asynchronous requests follow a non-blocking model, meaning that the client sends a request and DOES NOT have to wait for the response. It can continue with other tasks. Once the server sends back the response, the client can handle it. This approach offers significant advantages in terms of responsiveness and performance. One of the famous implementations of asynchonous communication is the javascript fetch() function.
Two important questions might have come to your mind first: why is there sync communication? Async seems much better. Second, how do Async functions know that the response is ready?
When do we use sync requests?
Generally speaking, I would say that while developing a web application, you would probably use asynchronous requests 99.9% of the time. However, sync requests may be used in:
- Debbuging and testing: In some testing and debugging scenarios, synchronous requests can simplify the process by ensuring that certain operations occur in a specific order, making it easier to trace and understand the sequence of events.
- Non-Interactive Processes: In cases where user interactivity is not critical, such as batch processing, synchronous requests can be used without causing disruption to the user.
How does Async functions know that the response is ready?
In general, how asynchronous operations know that the response is ready can vary based on the technology or programming language being used. Some of the common methods are:
- Callbacks: these are functions that get called whenever the response is ready, having the response as a parameter. It is used in programming languages such as Javascript, Python, and C++.
- Events: events are used to notify when a certain action occurs, and event listeners can be used to handle these events. This pattern is commonly used in event-driven programming, such as in graphical user interfaces (GUIs).
- polling: In some cases, asynchronous operations involve polling or checking at intervals to determine if the response is ready. This is common in scenarios like waiting for a job to complete on a remote server or checking for the availability of a resource.
In web development, the choice between synchronous and asynchronous requests defines user experiences. Synchronous requests have their place in certain scenarios, but modern web development leans heavily on asynchronous approaches for responsiveness and interactivity. Striking the right balance is crucial, as the lines between these paradigms blur. Developers must adapt and choose wisely to create web applications that excel in performance and user engagement, embracing the fluidity of web development for a promising future.