Ajax (programming) Article Index for
Ajax
Shopping
Ajax
Website Links For
Ajax
 

Information About

Ajax (programming)




Ajax, or '''AJAX''', is a Web Development technique used for creating interactive Web Application s. The intent is to make web pages feel more responsive by exchanging small amounts of data with the server behind the scenes, so that the entire web page does not have to be reloaded each time the user requests a change. This is intended to increase the web page's interactivity, speed, functionality, and Usability .

Ajax is Asynchronous in that loading does not interfere with normal page loading. JavaScript is the Programming Language in which Ajax function calls are made. Data retrieved using the technique is commonly formatted using XML , as reflected in the naming of the '' XMLHttpRequest '' Object from which Ajax is derived.

Ajax is a Cross-platform technique usable on many different Operating System s, Computer Architecture s, and Web Browser s as it is based on Open Standards such as JavaScript and XML, together with Open Source implementations of other required technologies.


CONSTITUENT TECHNOLOGIES


Ajax uses a combination of:

  • XHTML (or HTML ) and CSS , for marking up and styling information.

  • The DOM accessed with a Client-side Scripting Language , especially ECMAScript Implementation s such as JavaScript and JScript , to dynamically display and interact with the information presented.

  • The XMLHttpRequest object is used to exchange data asynchronously with the web server. In some Ajax Framework s and in certain situations, an IFrame object is used instead of the XMLHttpRequest object to exchange data with the web server, and in other implementations, dynamically added < Script > tags may be used.

  • XML is sometimes used as the Format for transferring data between the server and client, although any format will work, including preformatted HTML, plain text and JSON . These files may be created dynamically by some form of Server-side Scripting .


Like DHTML , LAMP , and SPA , Ajax is not a technology in itself, but a term that refers to the use of a group of technologies.

The "core" and defining element of Ajax is the XMLHttpRequest object, which gives browsers the ability to make dynamic and asynchronous data requests without having to unload and reload a page. Given XMLHttpRequest can eliminate the need for page refreshes, other technologies have become more prominently used and highlighted with this development approach.

Besides XMLHttpRequest, the use of DOM, CSS, and JavaScript provides a more-enhanced "single-page" experience.


HISTORY


Microsoft's Remote Scripting (MSRS), introduced in 1998, acted as a more elegant replacement for these techniques, with data being pulled in by a Java Applet with which the client side could communicate using JavaScript. This technique worked on both Internet Explorer version 4 and Netscape Navigator version 4 onwards. Microsoft then created the XMLHttpRequest object in Internet Explorer version 5 and first took advantage of these techniques using XMLHttpRequest in Outlook Web Access supplied with the Microsoft Exchange Server 2000 release.


In addition, the World Wide Web Consortium has several Recommendations that also allow for dynamic communication between a server and user agent, though few of them are well supported. These would include:
  • The object element defined in HTML 4 for embedding arbitrary content types into documents, (replaces inline frames under XHTML 1.1)

  • The Document Object Model (DOM) Level 3 Load and Save Specification {Link without Title}



JUSTIFICATION

The core justification for Ajax style programming is to overcome the page loading requirements of HTML/HTTP-mediated web pages. Ajax creates the necessary initial conditions for the evolution of complex, intuitive, dynamic, data-centric user interfaces in web pages—the realization of that goal is still a work in progress.

Web pages, unlike native applications, are Loosely Coupled , meaning that the data they display are not tightly bound to data sources and must be first ''marshaled'' (set out in proper order) into an HTML page format before they can be presented to a User Agent on the client machine. For this reason, web pages have to be re-loaded each time a user needs to view different datasets. By using the XMLHttpRequest object to request and return data without a re-load, a programmer by-passes this requirement and makes the loosely coupled web page behave much like a tightly coupled application, but with a more variable lag time for the data to pass through a longer "wire" to the remote web browser.

For example, in a classic Desktop Application , a programmer has the choice of populating a Tree View Control with all the data needed when the form initially loads, or with just the top-most level of data—which would load more quickly, especially when the dataset is very large. In the second case, the application would fetch additional data into the tree control depending on which item the user selects. This functionality is difficult to achieve in a web page without Ajax. To update the tree based on a user's selection would require the entire page to re-load, leading to a very jerky, non-intuitive feel for the web user who is browsing the data in the tree.


ADVANTAGES OF AJAX



Bandwidth usage

By generating the HTML locally within the browser, and only bringing down JavaScript calls and the actual data, Ajax web pages can appear to load relatively quickly since the payload coming down is much smaller in size, and the rest of the layout does not have to be redrawn on each update. An example of this technique is a large result set where multiple pages of data exist. With Ajax, the HTML of the page (e.g., a table structure with related TD and TR tags) can be produced locally in the browser and not brought down with the first page of the document.

In addition to "load on demand" of contents, some web-based applications load stubs of event handlers and then load the functions on the fly. This technique significantly cuts down the bandwidth consumption for web applications that have complex logic and functionality.


Separation of data, format, style, and function


A less specific benefit of the Ajax approach is that it tends to encourage programmers to clearly separate the methods and formats used for the different aspects of information delivery via the web. Although Ajax can appear to be a jumble of languages and techniques, and programmers are free to adopt and adapt whatever works for them, they are generally propelled by the development motive itself to adopt separation among the following:

# Raw data or content to be delivered, which is normally embedded in XML and sometimes derived from a server-side Database .
# Format or structure of the webpage, which is almost always built in HTML or XHTML and is then reflected and made available to dynamic manipulation in the DOM.
# Style elements of the webpage: everything from fonts to picture placement are derived by reference to embedded or referenced CSS.
# Functionality of the webpage, which is provided by a combination of:
## Javascript on the client browser (also called DHTML),
## Standard HTTP and XMLHttp or client-to-server communication, and
## Server-side scripting and/or programs using any suitable language preferred by the programmer to receive the client's specific requests and respond appropriately.


DISADVANTAGES



Browser integration


The dynamically created page does not register itself with the browser history engine, so triggering the "Back" function of the users' browser might not bring the desired result.

Developers have implemented various solutions to this problem. These solutions can involve using invisible IFRAMEs to invoke changes that populate the history used by a browser's back button. Google Maps , for example, performs searches in an invisible IFRAME and then pulls results back into an element on the visible web page. The World Wide Web Consortium (W3C) did not include an ''iframe'' element in its XHTML 1.1 Recommendation; the Consortium recommends the ''object'' element instead.''