What Is AJAX?

What Is AJAX

Date First Published: 23rd September 2022

Topic: Web Design & Development

Subtopic: Web Development

Article Type: Computer Terms & Definitions

Difficulty: Medium

Difficulty Level: 7/10

Learn more about what AJAX is in this article.

Stands for Asynchronous JavaScript and XML, AJAX is a group of web technologies used to allow webpages to be updated asynchronously by working behind the scenes to exchange data with a web server, making it possible to update parts of a webpage without having to reload the whole page.

Websites using AJAX use a combination of JavaScript and XML to generate dynamic content and the word 'asynchronous' refers to the method requests are sent to the web server. Usually, when a script sends a request to a web server, it may receive data that can be displayed on the page. However, these events are considered asynchronous as they happen at slightly different times using AJAX. XML is used to exchange data between the web server and browser and JavaScript is used to update the content asynchronously.

Note: Info Icon

AJAX is not a programming language. It is a web-based technology.

In order for AJAX to work, users must have JavaScript enabled and their browser must support XMLHttpRequests. Any user whose browser does not support this or has the functionality disabled will be unable to properly use pages that rely on AJAX.

Note: Info Icon

Data is usually sent back to the browser in an XML format because it is easy to parse. The server can also send data as unformatted plain text or JSON.

AJAX Process

The AJAX process comes in these seven steps:

  1. An event occurs on a webpage, such as a button being clicked.
  2. An XMLHttpRequest object is created by JavaScript.
  3. The XMLHttpRequest object sends a request to the web server.
  4. The server processes the request.
  5. The server sends a response back to the webpage.
  6. The response is read by JavaScript.
  7. Finally, the action (e.g. page update) is performed by JavaScript.

When Is AJAX Used?

Whilst visitors may not have seen it, AJAX works on a lot of popular websites. It is likely that AJAX will be used in:

  • Voting and rating systems (e.g. polls) - Once the user clicks on an option and votes or rates, the webpage automatically updates the calculation without the need to refresh the page.
  • Search engines - Search engines, such as Google provide a list of search suggestions without the need to reload the page as the user types. These are most likely using AJAX to display the suggestions. Image searches that generate more thumbnails whilst scrolling through the list often use AJAX to display the list of images.
  • Social media - Social media pages usually only display a certain number of recent posts. AJAX can be used to display the additional posts whenever a user clicks ‘Older posts’ on a social media page.
  • Chatroom - On some websites, you may find a built-in customer support chatroom. These are likely to use AJAX so that the user can communicate with a customer support representative whilst browsing the page and the page does not need to be reloaded to receive or send a new message.

Advantages and Disadvantages Of AJAX

The advantages of AJAX are:
  • It enables interactive and dynamic websites to be created that use resources efficiently.
  • AJAX is capable of reading from data and sending data to a web server after the page has been loaded since scripts run on the client side instead of on the server side.
  • The page does not need to be reloaded to update it.
  • It reduces hits and the load on the server.
The disadvantages of AJAX are:
  • Search engines cannot read and index dynamic content generated by AJAX.
  • Any user whose web browser does not support XMLHttpRequests will be unable to use pages that rely on AJAX.
  • Whenever a user hits the back button on their web browser, they will not be able to return to the previous state of the page. Successful AJAX requests are not saved to the history of the web browser.


Feedback

  • Is there anything that you disagree with on this page?
  • Are there any spelling, grammatical, or punctuation errors on this page?
  • Are there any broken links or design errors on this page?

If so, it is important that you tell me as soon as possible on this page.


Comments