What is AJAX?

AJAX lets a web page ask the server for just the data it needs, receive the answer in the background, and rewrite one section of the screen while the rest stays put. Before background requests became common, many interactions with a server-driven site required a full page load. AJAX didn't introduce new technology: it gave an existing combination of browser features a name and helped popularize partial-page updates.

How AJAX works

Every AJAX interaction follows the same 4-step loop:

1. A user action fires a JavaScript event: typing in a search box, clicking a filter, hitting an add-to-cart button.
2. The script sends an HTTP request to the server in the background. Modern code uses the fetch() API; older code uses XMLHttpRequest.
3. The server returns only the data requested, usually a small chunk of JSON rather than a full HTML page.
4. JavaScript inserts the new data into the page through the Document Object Model (DOM). Nothing reloads, and everything else on screen keeps its state.

The technologies behind AJAX

AJAX isn't a single tool you download. It's a set of standard browser technologies working together:

• HTML and CSS: structure and style the content on the page.
• JavaScript: the language that ties the pieces together by requesting the data, reading the response, and updating the page.
• The Document Object Model (DOM): the live structure of the page that JavaScript changes to display new content.
• A request API: XMLHttpRequest originally, though modern applications use the newer fetch() API.
• XML (Extensible Markup Language) or JSON: the format of the data exchanged. Despite the acronym, today's responses are usually JSON.

Where you'll see AJAX

You've already used AJAX today, probably within minutes of opening a browser:

• Autocomplete: suggestions appear under a search box as you type, each keystroke fetching fresh matches.
• Store filters: tick a size or price filter and the product grid updates in place, with no refresh between clicks.
• Cart updates: add an item and the cart count in the header changes while you stay on the product page.
• Infinite scroll: a social feed loads the next batch of posts as you get near the bottom.

Where the name comes from

Jesse James Garrett, a co-founder of the design firm Adaptive Path, coined the term in his February 18, 2005 essay "Ajax: A New Approach to Web Applications." He wasn't announcing a new technology. He was naming a pattern that Google Suggest and Google Maps had already put in front of millions of users. Writing on the essay's 20th anniversary in February 2025, Garrett noted that the name has mostly fallen out of use because the technique became, in his words, "simply the web."

AJAX today

The acronym has outlived its own details. Modern applications send background requests with the fetch() API rather than the original XMLHttpRequest, and they usually exchange JSON, not XML. Developers rarely write the low-level calls by hand, either: libraries like jQuery wrap them in short helper methods such as $.post(), and modern JavaScript frameworks provide their own data-fetching layers. The same pattern powers single-page applications, which load one HTML document and swap all content through background requests from then on. MDN's glossary entry (last updated July 11, 2025) notes the technique is now so common that the specific term is rarely used.

When to use AJAX

A practical decision rule:

• Use AJAX when an action should update part of the current page: filters, autocomplete, cart changes, inline form validation.
• Use a normal page load when the visitor is moving to genuinely new content that deserves its own crawlable URL, like an article or a product page.
• Use WebSockets instead when the server needs to push updates continuously in real time, as in a chat window or a live dashboard, rather than answer one-off requests.

When in doubt, start with a normal page load. It's simpler to build, and search engines can index it with no extra work.

What goes wrong with AJAX

Three failure modes cause most AJAX trouble:

• Invisible content: text that only appears after JavaScript runs can be missed by search crawlers and answer engines that don't fully render pages. Keep content that needs to rank in the initial HTML, or render it on the server.
• Silent failures: when a background request fails and no error handling exists, the page looks normal while showing stale data. Handle the failure in code and tell the user something went wrong.
• WordPress overload: requests sent through WordPress's traditional AJAX API all go to one file, admin-ajax.php, and each call loads WordPress to answer it. A plugin that polls that file every few seconds can slow an entire site. Plugins built on the newer REST API use their own endpoints instead of that file.

If an interactive page seems stuck, open your browser's developer tools and look for failed requests in the network tab. If a WordPress site feels sluggish, check how often admin-ajax.php is being called, and see our guide to speeding up WordPress for the broader tune-up.