Asynchronous Javascript and XML AJAX

Asynchronous JAVA Script & XML (AJAX)

Asynchronous JavaScript and XML (AJAX) are set of technologies with different function that work together to allow the client-server to create a rich web application (Deursen & Mesbah, 2009). The purpose of this paper is to describe more about AJAX, how is it used to create a web application, the difference from classical web application, companies utilizing this technique, security issues, and how to migrate those concerns. Looking at past research journal articles to provide useful insights on the structure of the AJAX literature would help get a better understanding of the construction and buildup of knowledge in this field of technology.

An inclusive list of references is also offered on how traditional web application load unnecessary volume of information, but with utilizing AJAX download page design and fast upload of new data, which can reduce application's bandwidth by amount of data transfer. There is a strong necessity for a rich web application to be created at asynchronous interaction to help developers finish projects at well convenient time. AJAX technology is growing in supply chain and that's the main issue, but if issues can be mitigated it can be the top technology for developer in the near future.

Introduction

AJAX is an application used for web development that enables web sites enhancement and appeal. In lesser terms, without Ajax, web pages would lack the level of appeal and usability inherent in the most popular websites (Lixandroiu, 2008). The main draw in the use of AJAX is to enhance an already accessible website. So the idea is to create a functioning website and then incorporate AJAX to enhance usability and functionality.

According to Lixandroiu (2008), "Another advantage of Ajax is a decrease in bandwidth use. Bandwidth in web hosting refers to the amount of data that can be communicated between user and server/website. In Ajax, bandwidth is used only to accomplish specific demands without requiring that the page be reloaded (which requires bandwidth, every dime a request is made). Contents are loaded on demand and HTML is produced locally from the browser. Ajax also allows programmers to separate methods and formatting of specific information delivery functions on the Web." (Lixandroiu, 2008)

Additionally, according to Jiaqi, Jie, Shujuan, (2009), "With the popularity of the Internet and the rapid development of information technology, web application has become an integral part of the information age. Ajax (Asynchronous JavaScript and XMl) is a new interaction method between server and client side, and asynchronous interactive technology is involved with web applications, so that applications could give users more efficient response and a good user experience." (Jiaqi, Jie, Shujuan, 2009)

Essentially, AJAX enables the use of cache to retrieve website information without using bandwidth to reload the website. Without the use of AJAX, there is a question with regard to the inherent efficiency, usability, and potential for loading error with the non-AJAX-based website. Therefore, rather than having to update and retrieve information from the website, AJAX enables cache to obtain the requisite information and refreshes the webpage accordingly.

AJAX is a functional application that has tremendous benefit for small and medium sized businesses that have capital constraints that perhaps prevent a greater share of bandwidth capacity to the website. As traffic to the site builds up, the inability for the site to load quickly and effectively becomes an issue. Additionally, programmers are able to incorporate a variety of languages into the development of specific goals as a conduit to further communication between the "client and server browsers." (Lixandroiu, 2008)

According to Jiaqi, Jie, Shujuan, (2009), "Traditional web applications allow users to fill out the form, and then send a request to the web server when the form is submitted. The server receives and processes the request, then returns a new page. This transaction wastes a log of bandwidth, as most HTML codes in the two pages are the same. Since each interaction of the application needs to send out the requests to the server, the response latency of the application depends on the server respondence period, which has resulted in the problem that the answering to the user interface is much slower than the local applications." (Jiaqi, Jie, Shujuan, 2009)

By adapting a multi-language format, the interface becomes extremely friendly to programmers that would like to adopt AJAX as their web application. According to Lixandroiu (2008), "Programmers can use whatever languages or formats work for their specific goal. For example, JavaScript on the client-side browser is combined with XML Http to enable communication between client and server browsers. Then any server-side program or scripting language allows the programmer to quickly respond to client requests in a language and format they are familiar with." (Lixandroiu, 2008)

The future is ostensibly the present with regard to the web based interface improvement applications. The level of integration between the website and the server via the AJAX multi-lingual capability has enabled dynamic analysis within the domain. According to Marchetto, Ricca, Tonella (2008), "Asynchronous Javascript And XML (AJAX) is a Web development technology that allows developers to realize Rich Internet Applications (RIA'ss), i.e., Web applications that include advanced and sophisticated user interactions, that are not possible according to the traditional (multipage) Web paradigm. The main difference between traditional multipage Web applications and AJAX-based applications is that the "more conventional" and synchronous request-response protocol has been replaced by one based on asynchronous communications." (Marchetto, Ricca, Tonella, 2008)

AJAX-based Web 2.0 (Mesbah & Deursen) is defined. According to Mesbah & Deursen (2009), "Recently, many new web trends have appeared under the Web 2.0 umbrella, changing the web significantly, from read-only static pages to dynamic user-created content and rich interaction. Many Web 2.0 sites rely heavily on AJAX (Asyncrhronous JavaSCRIPT and XML), a prominent enabling technology in which a clever combination of JavaSCRIPT and document Object Model (DOM) manipulation, along with asynchronous client/server delta-communication is used to achieve a high level of user interactivity on the web." (Mesbah, Deursen, 2009)

The industry trend appears to be the adoption of AJAX as the web application. The testing of AJAX states is achieved using invariants (Mesbah, Deursen, 2009). According to Mesbah & Deursen (2009), "With access to different dynamic DOM states we can check the user interface against different constraints. We propose to express those as invariants on the DOM tree, which we thus can check automatically in any state. We distinguish between invariants on the DOM-tree, between DOM-tree states, and application-specific invariants. Each invariant is based on a fault model, representing AJAX specific faults that are likely to occur and which can be captured through the given invariant." (Meshbah, Deursen, 2009)

The invariant is expressed on each branch of the DOM tree as a means to test the interface against different constraints (Mesbah, Deursen, 2009). As each invariant represents a fault on the interface, running the AJAX states through invariants will enable improvement by identifying the faults that are likely to occur when not running in simulation. The improvement on the design by running the system through the invariant process enables further development and integration of AJAX, DOM and JavaSCRIPT.

According to Mesbah & Deursen (2009), "Malformed HTML code cam be the cause of many vulnerability and browser portability problems. Although browsers are designed to tolerate HTML malformedness to some extent, such errors have led to browser crashes and security vulnerabilities. All current HTML validators expect all the structure and content be present in the HTML source code." (Mesbah, Deursen, 2009)

Additionally, according to Mesbah & Deursen (2009), "To prevent faults, we must make sure that the application has a valid DOM on every possible execution path and modification step. We use the DOM tree obtained after each state change while crawling and transform it to the corresponding HTML instance. A W3C HTML validator serves as oracle to determine whether errors or warnings occur." (Mesbah, Deursen, 2009)

Literature Review

AJAX applications involve Client-Server interactions which dictate the relationship between the end user computer and the host server. According to Matthijssen, Zaidman, Storey, Bull, Deursen, 2010), "Over the last decade web development has evolved from creating static web sites to creating rich and highly interactive web applications. The most important technology in realizing this shift is Ajax (Asynchronous javascript and XML), an umbrella term for existing techniques such as JavaScript, DOM manipulation and the XML Http Request object." (Matthijssen, Zaidman, Storey, Bull, Deursen, 2010)

According to Matthijssen et al., "Ajax is popular: since the term was coined in 2005, a vast amount of Ajax enabled web sites have emerged, numerous Ajax frameworks have been created and "an overwhelming number of articles have appeared." A good example of an Ajax application is Gmail, which uses Ajax technologies to update only a part of the page when you open an email conversion, and to suggest email addresses of recent correspondents as you type." (Matthijssen, Zaidman, Storey, Bull, Deursen, 2010)

However, Matthijssen et al. also point to AJAX as a hindrance as it makes web development more complex. According to Mathijssen (2010), "Unfortunately, Ajax also makes developing for the web more complex. Classical web applications are based on a multi-page interface model, in which interactions are based on a page-sequence paradigm. Ajax changes this by allowing asynchronous requests to be made after a page has been loaded and allowing JavaScript code to update parts of the page in the browser, effectively making delta-updates without reloading the complete page." (Matthijssen, Zaidman, Storey, Bull, Deursen, 2010)

Instead of a new web page being loaded with new information, AJAX is able to update specific parts of the webpage and therefore when the browser is refreshed or reloaded, the specific asynchronous areas of the web page are remitted with new information and therefore are able to update without forcing the browser to refresh to a new page. Although the authors describe this process as complex, ostensibly the ability for asynchronous requests provides the user with the ability to save memory and RAM.

According to Mathijssen et al. (2010), "To gain real world insights, we required a target application that was representative of a real world Ajax application and written using languages and technologies that our participants were familiar with. The Java Pet Store satisfied these requirements. It is a reference application, "designed to illustrate how the Java Enterprise Edition 5 Platform can be used to develop an AJAX-enabled Web 2.0 application." (Mathijssen, Zaidman, Storey, Bull, Deursen, 2010)

Based on the DOT invariant testing, the target applications were created to facilitate "real world insights representative of a real world Ajax application and written using languages and technologies that our participants were familiar with." (Mathijssen et al., 2010) To reiterate, the functionality of AJAX was a function of its multi-programmatic language capability that would make it extremely user friendly.

JAVA's pet store worked to provide these target applications due to the market growth for the AJAX application as well as the research that defined the increased operability by locating and reprogramming the application to render the faults as no longer viable. The problem solving and troubleshooting of the system for 2.0 did involve a targeted study to identify dynamic analysis as a function of reintegrating AJAX as a more complete application to the web.

According to Matthijssen, et al. (2008), "Central to this part of the study is our second research question: "Can dynamic analysis improve program understanding for Ajax applications?" If this is the case, we would also like to learn more about how this works, and what we can do to further improve understanding. We obtained insights into these questions via four different routes: the pretest-posttest, the questionnaire about feature usefulness, observing participants using the tool and the final interview." (Matthijssen, et al., 2008)

FireDetective (Matthijssen et al., 2008), is the tool that enables dynamic analysis whilst implementation to the AJAX framework. According to Matthijssen et al., (2008), "A possible explanation could be that the tool offers the option to switch to a more top-down way of understanding. From the observations and interviews conducted during the user study we identify three different ways to further support the understanding process: incorporating information about additional abstractions (such as various kinds of XML bindings and JavaScript parsing errors), exploration of other kinds of visualizations and integration with existing tools, such as Firefox' FireBug add-on." (Matthijssen et al., 2008)

According to Jiaqi, Jie, Shujuan, (2009), "Through the AJAX asynchronous communication mechanism, the function of Google Suggest can automatically return the search information which matches user input without submitting the whole web forms. This has changed the old search information which matches user input without submitting the whole web forms. This has changed the old search pattern, shortened the time on search and enabled the user to find the target information more quickly." (Jiaqi, Jie, Shujuan, 2009)

AJAX ostensibly revolutionized the search engine optimization function for Google Suggest. The dynamic search capability of Google Suggest is a function of AJAX and the elements of the underlying search pattern are primarily asynchronous Javascript And XML. According to Marchetto, Ricca, Tonella (2008), "On one hand, AJAX improves the responsiveness and usability of Web applications. On the other hand, it makes the testing phase more difficult. In fact, with the advent of AJAX, new problems are added to those already known in the Web testing area. Testing AJAX applications is complicated: by the need of understanding the asynchronous logics (AJAX introduces request-response "queues," respectively, on the server and on the AJAX engine, by the dynamic page creation/alteration, and by the bundle of technologies employed." (Marchetto, Ricca, Tonella, 2008)

According to Wusteman & Padraig (2006), "The use of Ajax in Google Suggest improves the traditional Google interface by offering real-time suggestions as the user enters a term in the search field. For example, if the user enters xm, Google Suggest might offer refinements such as xm radio, xml, and xmods. Experimental Ajax-based auto-completion features are appearing in a range of software. Shanahan has applied the same ideas to the Amazon online bookshop. His experimental site, Zuggest, extends the concept of auto-completion: as the user enters a term, the system automatically triggers a search without the need to hit a search button." (Wusteman, Padraig, 2006)

The idiosyncratic fault behavior of the AJAX application was addressed as a function of the DOM invariant on the tree branch to where simulation tests are ran under different scenarios to determine the appropriate solution based on the most frequently reoccurring errors. According to Marchetto, Ricca, Tonella, 2008, "As reported by Marchetto et al., existing testing techniques working with traditional Web application seem to be inadequate to test AJAX-based Web applications, because they are not designed to address the specific features offered by AJAX. Hence, new approaches and tools are needed for AJAX testing." (Marchetto, Ricca, Tonella, 2008)

The critical processes of AJAX are detailed below:

HTML and CSS for information presentation.

DOM to access and modify the displayed information.

XML HTTP Request object to retrieve data from the Web server.

XML to wrap data.

Javascript to bind everything together and to manage the whole process.

Source: Holub (2006) AJAX is no panacea.

According to Holub (2006), "AJAX is a bunch of technologies used to simplify the implementation of rich and dynamic Web applications. With AJAX, developers can implement asynchronous communication between client and server, on-the-fly form data validation, form-data auto completion, and sophisticated GUI controls based on client-side component update (i.e., without page reloading)." (Holub, 2006)

Additionally, according to Holub (2006), "Results indicate that state-based testing is powerful and can reveal faults otherwise unnoticed or very hard to detect using existing techniques. On the other hand, existing techniques are still useful in that they can reveal complementary faults. The effort involved in state-based testing is quite high, compared to the other techniques, especially if the preparation phase is taken into account. However, such an increase may be justified by a higher and more specific fault-revealing potential." (Holub, 2006)

According to Wusteman & Padraig (2006), "There have been many attempts to enable asynchronous background transactions with a server. Among alternatives to Ajax are Flash, Java Applets, and the new breed of XML user-interface language formats such as XML User Interface Language (XUL) and Extensible Application Markup Language (XAML). These all have their place, particularly languages such as XUL. The latter is idea for use in Mozilla extensions, for example. Combinations of the above can and are being used together; XUL and Ajax are both used in the Firefox extension version of Google Suggest. The main advantage of Ajax over these alternative approaches is that it is nonproprietary and is supported by any browser that supports JavaScript and XML Http Request-hence, by any modern browser." (Wusteman, Padraig, 2006)

Additionally, according to Wusteman, Padraig (2006), "It might be assumed that the use of Ajax technology would result in a heavier network load due to an increase in the number of requests made to the server. This is a misconception in most cases. Indeed, Ajax can dramatically reduce the network load of Web applications, as it enables them to separate data from the graphical user interface (GUI) used to display it. For example, each results page presented by a traditional search engine delivers, not only the results data, but also the HTML required to render the GUI for that page. An Ajax application could deliver the GUI just once and, after that, deliver data only. This would also be possible via the careful use of frames; the latter could be regarded as an Ajax-style technology but without all of Ajax's advantages. (Wusteman, Padraig, 2006)

The security risks of AJAX are worthy of mention. According to Vijayan (2007) "Among the biggest threats, said Billy Hoffman, lead research and development engineer at Web security vendor SPI Dynamics Inc. In Atlanta, is that poorly coded AJAX sites can provide hackers with an opening to change the order in which a program executes functions. "Any secrets stored in JavaScript will be found and exploited," Hoffman said in a white paper he wrote with Bryan Sullivan, development manager at SPI. "This is a far easier mistake to make in an AJAX application than in a traditional Web application because the client plays a larger role in data processing, presentation and possibly storage." (Vijayan, 2007)

However there are applications available to 'clean up' the threats associated with AJAX. According to Morejon (2006), "The danger to IT organizations is that AJAX technology is being perceived as a direct pipeline into corporate data. That's pushing developers to inadvertently expose more data and server logic than ever before. AJAX's logic can be hidden from client-side security scanning technologies, allowing hackers to set up new attacks from remote servers. AJAX also falls prey to well-known vulnerabilities such as cross-site scripting, SQL injections and credentials-based security holes." (Morejon, 2006)