Ajax journey (1) -- What is Ajax

I was learning about DRP, but I accidentally found that some of the documents attached had some benchmark books. One of them was about Ajax. I looked at it and it was quite good. So I decided to pause DRP and study Ajax again. I remember the first time I learned about Ajax, I thought it was a mess. After watching the video, I only expected it to be confused.

But it doesn't matter. In the words of Mr. Mi, this is normal.Because the first "do not understand", the second "may understand ".Therefore, this blog series is generated like this ~ I hope it will help you.

 

To put it alone, Ajax seems very advanced. Let's take a look at the definition of Baidu Encyclopedia:

Ajax is "Asynchronous JavaScript + XML" (asynchronousJavaScript and XML) Is a web development technology used to create interactive web applications.How are you doing? I don't know much about it ~ But is it really so profound? I don't think so. Check whether you understand the definition below.

I thinkAjaxIt is a technology, or even a skill, used to update webpages.Or not? Let's take a look. You should have used Google map. Do you need to refresh the map when I zoom in or zoom out the map to find the location to be queried? However, if Ajax technology is not used, we need to refresh all the content. This requires a lot of effort and the performance is definitely not optimal. It is extremely easy to see. After clicking refresh, there will be a long wait, in addition, the page is blank during the waiting process. This situation is extremely unfriendly to users. Using ajax allows us to implement partial updates at the desired location to solve the problem.

In the following exampleBased onGoogle Maps of Ajax technologyApplication ModelFor example, let's talk about what Ajax is and what role Ajax has.

 

The Ajax-based Google Maps application model consists of five layers:

1.Client browser:It is the browser used by the user. We use a browser to request map data in webserver and display the map information we need. The interface is as follows:

2. AjaxEngine:It is located between the user and the server, and its task is to implement the smooth transmission of pages, eliminating the defects that users can only wait before receiving responses during network interaction.

3. googlemapsServer:After the page is loaded, the map data obtained from Google mapsserver is displayed.

4. WebServer:Accept requests from the browser. After analysis and processing, the data is returned to the browser.

5.Database:Store the corresponding data information.

 

How can I understand the functions of Ajax at these five levels? The assumption is not very understandable. It doesn't matter. I will explain it later.

Previously, I have explained the role of Ajax in Google Maps. below, I will explain its features through a comparison.

Traditional web pages (without Ajax),To update the content, you must reload the entire webpage. At this time, if the request server information or the server returns a small amount of information, the effect may not be very obvious compared with that after Ajax is used. However, for Google Maps, its data information volume is quite large. If Ajax is not used, you can imagine what the result will be.

Today's webpage (UseAjax ),By performing a small amount of data exchange with the server in the background, Ajax enables asynchronous updates on webpages. This means that a part of the webpage can be updated without loading the entire webpage again.

 

At this point, we should have almost the same understanding of what Ajax is. SoAjaxHow does one Implement Asynchronous updates?Let's meet in my next blog ~

Ajax journey (1) -- What is Ajax