In the earlier days, the web used a traditional or classic approach to display information where, for every event, e.g a button click, the whole page used to get refreshed. And people often had to witness a blank white screen till the page was redrawn. If not, then they still had to wait till the page was refreshed and in a ready state again. The whole experience was very frustrating…. every time….!!
There were various attempts made to tackle this frustration. One Samaritan, by the name of Jesse James Garrett, started publishing articles about what he called “Advanced Web Techniques.” But yet people were somehow not convinced and ready to use this technic.
Fortuously, in one of his speaking sessions, Garrett revealed that Google used the very same technic. Invoking that single name, Google, was enough to change peoples’ point of view.
AJAX came to life and widespread adoption.
What is Ajax?
Ajax is one of the hottest web technologies of the current age.
However, Ajax is far more than just a fad; it’s a powerful approach to building Web sites and it’s not nearly as hard to learn as an entire new language.
Oh.. and btw, if you were wondering what the full form is, that’s…
And trust me, this is only useful in interviews
The asynchronous part comes from the fact that when a change has to be made to the current page (the user clicks on a link, or submits some information), only the part to change is transferred from the server, and not the entire page.
Now for the name…
With apologies to the people who make the cleanser and the detergent, legend has it that the original Ajax was the second most powerful of the Greek warriors at Troy. Even though he had some issues, his strength and skill in battle were second only to Achilles. In naming the technology Ajax, Jesse James Garrett gave the technology both Ajax’s strengths and issues… thus the name “AJAX”
Here are some reasons why AJAX is disruptive in the way people use the Web.
Why Ajax rocks
AJAX has two huge benefits:
- Speed and invisibility makes for a very slick user experience.
- The smaller server resources footprint helps server scalability.
I’ll explain these. If you post using AJAX, only the data (or parameters) that the server function requires is posted. In a login scenario, only the username and password strings (100 bytes maybe) are sent to the server and only a boolean value (1 byte) is returned. This means that only 101 bytes (excluding network handshaking traffic) is sent & received. If we were to create the same functionality using ASP.NET, all the state data is pushed to a server and the whole page is returned. Should the page use 20Kb of traffic, AJAX will save nearly 99.5% of this.
Further more, when using AJAX your web server and or db server (or whatever your config is) does not have to do any processing other than running the called function and returning the return value. No page load events, no xsl transform etc. This can have a huge impact in an enterprise environment.
When should I use it?
- On-the-Fly Form Data Validation
- Auto completion
- Master Details Operations
- Sophisticated UI Controls (widgets)
- Quick data store updates
- Real-time information feeds
When I shouldn’t
Even though forms are the single biggest beneficiary of “Ajaxification,” a simple comment form, or submit order form, or other one-off rarely used form does not benefit from Ajax driven submission. Generally, if a form is not used much, or it’s critical to work properly, Ajax is not that helpful.
LiveSearch on blogs is more annoying than useful. There’s a reason that Google Suggest is staying in beta and not going on the front page of Google. Searching on Start.com or Live.com doesn’t allow use of the back button to see a previous search, or previous pages.
Replacing a large amount of text.
Ajax saves a complete refresh of the page, so small pieces of the page can be more dynamically updated. But if nearly everything on a page is changing, why not just request a new page from the server?
Sliders, drag and drops, bouncies, mouse gestures, whatever. Mostly these widgets can be replaced with more intuitive controls, or eliminated altogether in favor of simplicity. In picking colors, maybe a slider widget is useful to pick the exact shade. But in picking a price point in a store, a slider to pick the price to the cent is just overkill.
Why Ajax sucks
Using AJAX to asynchronously load bits of content into an existing page conflicts with the way we are used to navigate and create bookmarks in modern browsers. Because viewing some part of the page information no longer corresponds to a newly loaded page, the browser history and bookmarks will not be able to restore the exact page state.
Also, clicking the Back button in a browser might not have any effect, since the URL was unchanged (even if parts of the page were changed). To overcome these problems you must implement a way to save the current page state programatically so that it can be restored later on, when called from a bookmark or from the browser history.
How it works…
Following are the essentials for working with AJAX:
- Server-based AJAX libraries – generate the AJAX code from your server application.
Following are some of the most popular AJAX libraries:
- ASP.NET AJAX Extensions
- Direct Web Remoting (DWR)
- Google Web Toolkit (GWT)
Who’s using Ajax
Rightly said, images speak louder than words…
Here are some handy references to get started…. NOW :
So start rockin…!!!And stay tuned for my next blog on the how to implement Ajax in the real world…