Ajax: A new way to build Web applications)

Source: Internet
Author: User

If you want to do something that is most attractive, you can create a web application. After all, when did you hear people praise the interaction design of a product last time? (Except iPod) they are both cool and innovative projects.

No matter what, web designers have no better way to design interactive web, but they have a little envy for our desktop software colleagues.ProgramRich interfaces and incomparable response capabilities for web programs. Similarly, with the rapid development of web, there is a huge gap between the experience we provide and the experience users get from desktop applications.

The gap is now disappearing. Take a look at "Google suggestion (Google suggest)". observe that it displays the update speed of the suggestion entries based on your input, almost immediately. Let's take a look at "Google Maps". Zoom in and move and scroll with your mouse. These actions respond almost immediately without waiting for page refresh.

"Google suggest" and "Google Maps" are two typical examples of Ajax technology. Ajax is short for Asynchronous JavaScript and XML. It shows a fundamental change in web development, that is, what may be done on the Web. Ajax Definition

Ajax is not a technology. It is actually several technologies, each of which has its own unique characteristics. Together, Ajax becomes a powerful new technology. Ajax includes:

    • XHTML and CSS
    • Use Document Object Model for Dynamic Display and Interaction
    • Use XML and XSLT for Data Interaction and operations
    • Use XMLHttpRequest for asynchronous data receiving
    • Bind them together using JavaScript

The traditional web application model works like this: Most user actions on the Interface trigger an HTTP request connected to the Web server. The server completes some processing-receiving data, processing computing, accessing other database systems, and finally returning an HTML page to the client. This is an old model. It has been used as a web application since hypertext was used. But readers who have read the elements of user experience must know that, what makes web interfaces easier to use than desktop software.

Figure 1: Comparison between the traditional web application model (left) and the Ajax model (right ).

This old approach makes us realize many technologies, but it will not produce a good user experience. What are users doing when the server is processing their own tasks? That's right. Wait. Users have to wait for every action.

Obviously, if we design Web applications according to the thinking of desktop programs, we don't want users to wait. When the interface is loaded, why do users need to spend another half of their time retrieving data from the service? In fact, why do we always let users see the program to fetch data from the server? How Ajax is extraordinary

By introducing an Ajax engine between the user and the server, you can eliminate the interaction process such as starting, stopping, starting, and stopping the web. it is like adding a mechanism to the program to make it more responsive, and it does.

Unlike loading a page, the browser loads an Ajax engine at the beginning of a session-written in JavaScript and usually in a hidden frame. This engine is used to draw user interfaces and communicate with the server. The Ajax engine allows Asynchronous interaction between users and programs-without waiting for server communication. Therefore, you do not need to open a blank window and wait for the cursor to keep turning. Wait until the server completes and then respond.

Figure 2: Comparison between synchronous interaction process (I) of traditional web applications and Asynchronous interaction process of Ajax applications (II ).

The user action that usually generates an HTTP request is now replaced by calling the Ajax engine through JavaScript. the response of any user action is no longer required to be directly transmitted to the server-for example, simple data verification, data editing in the memory, or even some page navigation-the engine can process it by itself. if the engine needs to retrieve data from the server to respond to user actions-assume that it submits the data to be processed and load the data to another interfaceCode, Or receive new data-the engine uses XML to make these jobs run asynchronously without mistaken User Interface interaction. Who is using Ajax?

Google made a huge investment in Ajax development. Last year, all major Google products used this technology-Orkut, Gmail, and the latest beta version of Google groups, Google suggest, and Google Maps-all of which were Ajax applications. (For more details about the actual Ajax technologies, see their analysis.Article: Gmail, Google suggest, Google Maps). Others, such as: Flickr, use many Ajax features that people like, and Amazon's a9.com search engine uses similar technologies.

These projects prove that AJAX is not only academic, but also has many successful applications in the real world. This is not a technology in any lab. Ajax applications can be big or small, from very simple, like Google suggest with a single function to very complex Google Maps.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.