Ajax (programming)
Ajax [ eidʒæks ] ( Apronym of Engl. Asynchronous JavaScript and XML) refers to a concept of asynchronous data transmission between a browser and the server. This makes it possible to perform HTTP requests, whereas an HTML page is displayed, and change the page, without completely reloading.
- 5.1 client platform
- 5.2 Server platform
- 6.1 No reload constructed pages
- 6.2 No browser plug-in is required
- 6.3 Extensive testing is required
- 6.4 Server-side browser detection
- 6.5 Using the "Back" button
- 6.6 polling issue
- 6.7 bookmarks
- 6.8 Feedback
- 6.9 Differentiation between concept and term
- 6:10 assistance of the MVC architecture pattern
- 6:11 Accessible Internet
- 6:12 Search Engines / Deep Links
The structure of an Ajax application
An Ajax application based on the following web technologies:
- HTML (or XHTML)
- Document Object Model (DOM) for the representation of data or content
- JavaScript for manipulating the Document Object Model and dynamic presentation of content. JavaScript also serves as an interface between the individual components.
- The XMLHttpRequest object part of many browser in order to exchange data asynchronously with the web server can base.
For the call of resources, functions or methods ( API) there are the approaches:
- REST - HTTP call using classical techniques such as: GET http://localhost/person/4
- SOAP - Transfer of method name and parameters as an XML document.
In asynchronous transmission of data, various methods have been established:
- ReST -like process to transfer the user data in text form.
- JSON, an on JavaScript tailored, text-based format for data and objects.
- Various proprietary XML formats.
- SOAP, a protocol for Web services, which usually uses XML as an interchange format.
In the context of Ajax applications and other web technologies are used, but have no causal connection with Ajax:
- CSS to format a web page.
- XSLT for data transformation.
History
Origins
From whom the term Ajax creation originally, is no longer clearly traceable. But it is certain that the concept Jesse James Garrett ( Adaptive Path Agency staff ) in his article Ajax: A New Approach has largely shaped to Web Applications February 18, 2005. Basically, the technological basis and the procedure, however, were already known and have been generally described by the term XMLHttpRequest. If you like, Garrett has therefore created the Ajax brand to summarize as various software technologies under one term.
The idea and the related technologies that are an Ajax based, are available in a comparable form since about 1998. The first component, which made it possible, on the client side to trigger an HTTP request, based on an architecture developed by Microsoft Remote Scripting Initially implemented component as a Java applet, it was later replaced by an inline frame element. Later this idea was refined by the Outlook Web Access team. This component is part of the Microsoft Exchange server and was soon delivered in the form of XML support, as part of Internet Explorer 4.0. Some observers gradually Outlook Web Access as the first successful representatives of the Ajax approach. Nevertheless, these very early implementations of the concept is not based in part on the XMLHttpRequest object.
First Ajax applications
Later applications such Oddposts webmail service followed (now Yahoo mail). In 2005, the term Ajax was increasingly present by some groundbreaking events in the media. Firstly, using Google, the asynchronous communication paradigm in some known interactive applications such as Google Groups, Google Maps, Google Suggest, Gmail and Google Finance. The article written by Garrett has now achieved a level of fame in Ajax environment. Ultimately, the Ajax support the Gecko engine has developed to an extent which makes it possible to use the Ajax technology in many ways.
Standardization of Ajax technologies
Latest allow standardization endeavor of the XMLHttpRequest object part of the W3C and the founding of the Open Ajax Alliance recognize that the industry in the future integrate the Ajax technology into their products and thus support on a broad basis.
In the area of standardization of the protocol between the web browser and web server of the communication standard SOAP can be used for Ajax applications, so existing applications based on Web services reuse on a server.
Compared to conventional Web applications
Ajax applications give the impression that they are executed entirely on the user's computer. The process flow of a traditional Web application, however, is determined by the stateless nature of the HTTP request. The request-response paradigm so directly related causes each time a user action an associated request ( stands for Request ) is sent to the server. Is delayed the required response ( engl. Response) of the server or is this even, so inevitably, longer waiting times or in the worst case, breaks in the flow of the application. The described scenario makes it clear to the user of a traditional Web application that was distributed to several areas - a fact which should be made more transparent and thus fault-tolerant with the Ajax programming technique.
Garrett describes the execution of Ajax requests an " Ajax engine ", written in JavaScript, a component that handles the client-side work:
Traditionally, Web applications provide forms that were previously filled by the user to a web server. The web server responds by sending the user's browser a corresponding to the previously submitted form data newly generated web page. Due to the fact that the web server has to create a new web page on every request by the user and convey, the application appears to the user as a whole slow and not very intuitive, if you compare this with an ordinary desktop application.
However, Ajax applications are able to send requests to the server, where only the data is requested, that are actually needed. This is done by calling a web service in one of the variants described above (REST, SOAP). It is called as asynchronous communication, that is, while the data downloaded from the server, the user can continue to interact with the surface. If the data is finished loading, then naming a previously JavaScript function is called, which can embed the data into the website.
As a result, one obtains a user interface that reacts much more quickly to user input. One reason for this change in behavior is the fact that much less data between web browser and web server need to be replaced, and that the loading of data is asynchronous. In addition, the web server load is reduced, since already many processing steps can be made on the client side.
Imagine, for example, a Web application for managing photographs. If the user wants a photo add a description or a title, it would have to be transferred again to a traditional approach to programming that the entire page including the reduced photo - views. With Ajax technology, only the area of the site is updated, which was also changed. This example illustrates how it is possible within the Flickr application to change title of individual images.
Example
The Ajax request is sent as follows:
Var myAjax = new Ajax.Request ( " datum.php " {Method: 'get', onComplete: zeige_datum } ); the PHP script provides a piece of plain text that can be interpreted as HTML fragment:
Once the data has been transferred to the finished browser, the function is called zeige_datum which can then further process the data and integrate it into the website. For this purpose, only conventional JavaScript methods and properties are used in this example.
Since Ajax applications correspond to the client -server architecture principle, a component is necessary both within the web browser as well as on the appropriate server that allows an Ajax - based communication.
Client platform
The implementation within the web browser is done in most cases with the help of an extensive functionality based on JavaScript and the XMLHttpRequest object. Here there are two categories of platforms can be distinguished:
Direct Ajax implementations: They are on the client API for direct communication of data. It should be realized on the server in addition to the initial page displayed another entry point for the transmission of data.
Indirect Ajax implementations: This new HTML fragments are sent from the server to the client in order to supplement the existing page or replace parts of it. Usually the entire page to be displayed rebuilt this on the server, but only transfer the relevant differences to the client.
Both methods have advantages and disadvantages. While the direct use often saves server side resources, the indirect variant simplifies the implementation.
Server platform
The actual program logic or the process flow of the application is stored on a server. This happens for example in the form of EJBs. NET components or in the form of script components, as for example, are part of the scripting language Ruby. The Ajax concept itself requires no specific technique by which the server-side program logic must be implemented. Both the server and the application logic is called in Ajax context as a server platform.
An essential task of the server in Ajax applications is the provision of the required components in the browser. Since due to the security settings of the browser cross-site scripting is not allowed ( same- origin policy ), the web server has to provide and thus assume the function of a proxy computer and data from other servers for the client.
Pros and Cons Review
No reloading constructed pages
The biggest advantage of Ajax technology is the fact that data can be changed without the complete web page has to be reloaded from the web browser. This allows web applications to respond quickly to user input. In addition, it is avoided that static data that have not changed in certain circumstances, must be continuously transmitted over the Internet.
No browser plug-in is required
Since the Ajax technologies are freely available, they will be supported independently of the operating system of the Web browsers that support JavaScript, also. A browser plug-in is not required. This requires that JavaScript support has been disabled - exactly represents the biggest point of criticism and the greatest problems when using dar. comparable techniques, such as Adobe's Shockwave or Flash, but still suffers from the disadvantage that they are proprietary require a browser plug-in and are only available for certain platforms.
Extensive testing is required
As it has become even with DHTML applications to practice, also an Ajax -based application must be rigorously tested to so treat the idiosyncrasies of the various Web browser accordingly. Over time, the Ajax technology has evolved, which meant that for now these various program libraries are available. This can contribute to a largely error-free and simpler application programming.
Server-side browser detection
It also techniques have been developed, such as that developed by Sun JSF technology, Apache Wicket or developed by Microsoft webforms technology, making it possible to design web-based applications that come close to a desktop application. In addition, they offer the possibility, even users who use a Web browser without JavaScript support to operate properly. The browser type of the user is in this case determined on the server side, so that it is possible to send this only HTML pages, which can be represented by the web browser.
Use the "Back" button
One of the most commonly complained about disadvantages of Ajax technology is the fact that it is difficult to ensure the functionality of the "back" button of the browser. There is a danger that clicking the "back" button does not restore the previous state of the application, because browsers usually only static pages saved in their history. Distinguishing between a static page that was loaded entirely in the browser's cache, and a page that has been modified in a dynamic way, may be tricky. Basically, expect a user that a click of the "Back" button revised the last action incurred. Even button is often trying to move a page in the navigation path by clicking the "Back". Due to the dynamics with which many Ajax applications are affected, this is not always possible, since the individual navigation steps the user is technically very difficult to reproduce. Software developers have invented various solutions to address this problem. Most solutions are based on so-called inline frames, other HTML elements. The inline frame element is designed so that it is not visible to the user, and is used to fill the browser history of the user on this detour. (Google Maps results, for example a search in an invisible inline frame element by and filled with the consequent results, the Ajax element of the visible web page). The Dojo Toolkit allows the individual ajax requests by means of a so-called callback function ( using call back function) to pursue. The callback is always triggered when the user clicks the browser "back" button. About this detour, it is possible to restore the previous state of the application.
Polling problem
Since web servers are not in a position to forward asynchronous events to an Ajax client, if they have not been requested by the latter, the Ajax client must itself permanently to the Web server ask (the actual polling), if a new event has been created or a change has occurred in the application state. This produces a very different load on a server as compared to the load generated from conventional applications.
In order to avoid persistent polling, the technology has been developed, while retaining poll responses to an actual event or a time out occurs. Consequently, a request is an Ajax application, ideally linked server side, which can be used to ultimately, the application client when an appropriate event to send a response.
However, this technology raises new problems. It has been customary, per request to the server to create a thread whose resources could be released immediately after processing the request. In the above described polling technique, however, such release of resources is not possible. So it will remain resources, such as memory occupied. This problem poses new challenges to the scalability of an Ajax application. A possible solution to this problem is to use an application server that supports the principle of continuation ( Ger. continued).
Bookmark
A similar problem is the fact that it is almost impossible for websites that are updated dynamically to set a bookmark to a particular state of a Web application. Also, solutions to this problem have been developed in the meantime. Most of the anchor in the current URL is used in this context, which is after the hash ( #). In this way it is possible to monitor the process flow of an application. Moreover, the user is enabled to recover a particular application state of the said part of the URL. Many web browsers allow you to update the anchor through JavaScript dynamically. This allows an Ajax application to update the page content shown in parallel for processing. These approaches also fix some of the problems caused by the non-functioning back button.
Re-registration
The latency, ie the time interval between an HTTP request from the browser and the associated server response must be considered when developing an Ajax application. Without a clearly visible feedback to the user, pro- loading of individual application data and a correct handling of the XMLHttpRequest object can impose a user the impression that the entire application responds only viscous on its actions. Usually this is a fact which the user is only revealed heavy. For this reason, it is important to use so-called visual feedback such as the symbol of an hourglass to alert the user that currently certain background activities are taking place or data, for example, content to be loaded.
Differentiation between concept and term
Apart from the technical difficulties associated with Ajax, there was in the past repeatedly criticizes the fact that the company Adaptive Path, which coined the term Ajax originally coined, or other companies use the term as a marketing vehicle. In this context, it is criticized mainly is because the basics of Ajax were developed prior to the coining of the term. However, the coining of the term has also helped to revive the discussion around the browser as a fat client.
Support of the MVC architecture pattern
Although supports Ajax- based environment is not per se the MVC pattern, but this can be easily implemented. An implementation can have as a basis for the presentation layer, the entire browser window. Also, it allows Ajax to implement a cyclic or nested MVC model. In this case, individual presentation layer elements of a website have either a separate controller as well as a separate model. Both relationships are shown in the figures of this article.
Accessible Internet
If the Ajax technology can be used, so this presents a challenge if the Web application is to follow the WAI rules. Software developers need to offer alternatives for this reason, when a Web page, for example, for visually handicapped users with a screen reader should be accessible. This is necessary since most all Ajax applications are designed for a conventional graphical browser.
Currently often is this the so-called hook approach this week, initially a purely static application is sent to the browser, and then javascript enabled all AJAX functionalities are embedded.
Search engines / Deep Links
There are several ways to make it accessible to an Ajax application a search engine. The individual approaches vary in the degree of indexing can be achieved, and the manner in which this is achieved. For some websites, such as a course of study of a university, it is necessary that each area can be detected by a search engine. One side, however, that provides a webmail service, this will not make it necessary. The following are some strategies are known, which make it possible to have a website by a search engine index:
It should be noted that applying the Extra Link Strategy and the Secondary Site Strategy by search engines could possibly be interpreted as an attempt at deception ( cloaking ). The best way to avoid this is to provide a installed on the original page.
Status / dissemination
The following web browsers are currently able to run Ajax applications. Called is only the first software version, which made it possible to run Ajax applications. All subsequent versions imply the same support.
Application Examples
The following links refer to typical representatives of an application to Ajax- based. Some of them are by their new, intuitive user interface, a certain level of recognition. The link list, it is whether the current diversity of Ajax applications represent only a sample selection in this context and is deliberately kept very short.
- AjaxWrite - Word Processing
- IRows - spreadsheet
- NexImage - Web-based image editing tool
- Flickr - web application for managing photos
- Delicious - Web-based, communal bookmark system, proposes "tags" and terms
- Last.fm - Internet Radio
- All VZ Networks - Social networks
- eyeOS - Web Desktop
- Gmail - offers a kind of e -mail program for the web browser.
- Google Suggest - displays suggestions that the user could search
- Meebo - Web -based Instant Messenger that supports AOL, ICQ, Yahoo Messenger, MSN Messenger, Jabber and Google Talk accounts
- ET- Chat Webchatsystem