What is AJAX and how is it working?

If you have been studying web development from the ground up, you have certainly come across such a term as AJAX. You might have already checked it, but if you are wondering what it exactly is the meaning and function of AJAX or you are busy with other learning materials to wrap your head around, this article will provide you with an overview of what AJAX is.

What is exactly AJAX?

Sometimes you may hear someone mentioning AJAX as a programming language. This is actually a common practice, albeit, you should not confuse it with programming language. In the reality, it will be a mistake to call AJAX a programming language. A more accurate definition for it will be a combination of programming features which are used for performing certain most useful and spontaneous tasks.

By the way, the word AJAX itself stands for Asynchronous JavaScript and XML.

Now, when you know what AJAX is, it is time to understand the meaning of the technology behind it.

JavaScript is a programming language which is primarily used for user interactions and as well as  making a web page more dynamic in a user’s browser. Now, with the evolvement of Node.js we can programme server-side applications as well. XML stands for Extensible Markup Language which is a more flexible and advance stage of HTML. As you probably know, HTML means Hyper Text Markup Language.

How it all works when combined? Well, the word Asynchronous itself means that a process is happening simultaneously. Let’s say, you are taking a sip of coffee or water from your mug and are reading some information or watching a video at the same time. these tasks can easily be done without having to wait for finishing your quick sip of drink. The Asynchronous technology performs exactly in the same way. When a user sends a request to the server, generally, the whole webpage of the user is reloaded in order to make such a request. This would have happened for the technology which is not based on AJAX. If such an operation is performed on AJAX, the request is sent straight away and the data is fetched without a need to make the browser reload.

How is AJAX working?

As you can imagine, this is a giant step forward for the developers. When an Ajax call is made by a user, it is typically achieved by a button being clicked. This simple action triggers the call of the request and JavaScript immediately creates an object to hold the relevant data altogether. The object is then sent to the server by the means of the TCP/IP configuration. TCP stands for Transfer Control Protocol and IP stands for Internet Protocol. The latter one determines the identity of the website while TCP can be compared to a vehicle moving along the road carrying the information back and forth.

After this step, the server processes the request and performs every action required for fetching the exact piece of information the browser needs. Then, the browser receives that piece of information which is sent back by server. Now, JavaScript takes control over the process. JavaScript reads the information and takes proper actions based on the request. This is achieved mostly by filing up the user’s screen with necessary data. Of course, this is done in a presentable way, however, there is also a possibility of receiving the information in the form of a special object for raw data.

This had been done by a Javascritp method called XMLHTTP request before the evolvement of the current technology. With the modern browsers, this task is solved by performing a Fetch request. By the way, this is also another JavaScript feature which can be used for performing such requests in a more modern way.

With this, you can be sure that you have an overview of how AJAX works and what AJAX is. You can go on from here and test it out yourself if you want to see how the technology is working in practice. All you need to have is your code editor. There are plenty of public API you can work with to test this mind-boggling feature out.