Google Maps and AJAX: Web 2.0 on Your Web Site

In the last 6 months or so there has been a lot of talk about “Web 2.0”. Some of this is certainly hype, and the desire by some people to put a label on things. In any event, what we do have happening is the emergence of some pretty cool technologies and one of those technologies is called AJAX or Asynchronous JavaScript + XML. If you want the full story on AJAX from one of the chief drivers behind the idea, you can read this article over at Adaptive Path.

You’ll notice he mentions Google Maps, and we’ll get to that in a moment. We do want to first summarize what AJAX is in a nutshell and how JavaScript fits in.

- OR -


AJAX in a nutshell

One of the drawbacks of the web is the push and pull of the client-server relationship. The client requests something, and then you wait while the server responds. Your page reloads, and the process continues. For most mundane situations this is just fine. If you are reading a text article like this, the response from the server is generally almost instant (unless the site is extremely ad-heavy).

The problem begins to rear its ugly head when you want to begin building richer sites and applications. When you want the user to start interacting with the interface – like a map for example! Then you begin to see the inherent problem in the client-server request/response cycle. I want to move the map over one mile because what I want to see is just out of my view. I click an arrow or some widget, and the client calls the server, gets the direction and whatever else it needs from the request to figure out what John Doe wants to see, and then pushes back the next version of the map. But oops! I went the wrong way – I wanted to go East, not West! Oh boy, now you have to click twice, and wait twice as long.

Apply this concept to any rich application where you’d want more than a casual interaction with your users. Even adding items to a shopping cart and updating that card can be a tedious process. Then think about more customized and “cooler” interfaces you might want to do – such as changing page layouts on the fly, color schemes or even data sets. Again, the typical client-server cycle – a synchronous cycle.

AJAX however, is asynchronous. In other words, it does not wait for the client-server cycle – it happens independently instead. So when you request to move the map – the action begins happening immediately. There is no waiting for the server to respond because there is already an AJAX engine loaded up (when you first arrives) that facilitates the data transfer. If you have ever played around with a Google map (or any of the neat websites that are making use of them) you know exactly what we’re talking about.


Be the first to write a review

You must me logged in to write a review.