AJAX: Who When Where What Why

Who & Where?

Before going into who actually discovered/invented Ajax, one thing you must know is that AJAX as the full name suggests is it actually is combination of JavaScript with further xml (DOM) support. Behind the scene there are many other technologies also like JSON, Prototype etc which makes full Ajax framework.

Now the connecting question arises who invented JavaScript?

‘Brendan Eich’ at Netscape originally invented a simple scripting language in 1995, called LiveScript. It was basically proprietary add-on to the HTML. With the growth of Sun’s new language, Java, gaining popularity, Netscape switched over and came up with a new scripting language called JavaScript. Here only the first four alphabets are common ‘Java’ otherwise they are completely different from each other. JavaScript added interactivity to previous boring dump HTML which made it so popular later on.

When:

When was Ajax released?

You can find details reading for when and whereabout of Ajax at my old post at this link. http://abhi-ajax.blogspot.com/2009/12/birth-of-ajax.html

What & Why:

What is Ajax and why it is used?

Anybody can program using the same old request/response model. But if you want faster apps that feel like you’re working on a desktop, you need something new—welcome to Ajax, a completely different approach to web programming:

AJAX is a combination of many technology put together to help building web based applications better and faster along with great user experience. JavaScript and XML are main technology used to provide interactive web applications. JavaScript uses XmlHTTPRequest object to exchange data asynchronously over the client and the server.

The biggest advantage of AJAX technology is that a webpage doesn’t have to be completely reloaded when user interacts and also that it works in background without the knowledge of user. JavaScript that runs in the background when u click on any button/event communicates with the server. Once the response is received only the part of the page which is needed to be changed is updated with the response (wow doesn’t have to wait for entire page to reload). Believe me it really hurts when your website’s full page is loaded (my office website + my company product does the same and I’ve seen the client reaction on the same. It sucks!! L)

Birth of AJAX

I have for long wanted to trace the story behind the evolution of the AJAX technology. Did I just say “technology”; many bloggers might want to thrash me for referring AJAX to being a technology because I have come across heated arguments between bloggers who actually know what made the existence of AJAX as we see today. There are vendors who make AJAX sound lucrative as a new technology for luring some hapless customers into buying their products which are now running the hot property called AJAX into their applications. Surely the customers be lured but its still a mystery to me as to how this has taken place silently in the hoods without the inventor not giving in a fight. Are the patent issues gone with the wind or are proprietary concepts being diluted when they fall in the web domain.

I wont be starting a wasted discussion on who are fighting for whom and what is right or what is wrong. I am here to let the world know what exactly went in through to making AJAX a reality. All the glossy and stylish looking animation and effects, asynchronous pull down data from the server, the added interactivity, the loads of frameworks that spring up every single day, the commercial AJAX developing IDE’s, the server side code generators for AJAX web applications, the mashups that people across the globe do to change the face of the web today all come down to a single object which was created for a purpose which was actually apart from what it is being used for. This was the start of the AJAX story.

I attribute the success of AJAX to Microsoft and Google. Microsoft, because it invented the XMLHTTP object and without Google standing forth on this aspect, you wouldn’t have been able to see any of the above mentioned miracles imparted to the web today. Microsoft had created the XMLHTTP ActiveX object probably in 1999 for its Outlook Web Access 2000 release since it was aiming a web based access for the Exchange Server which was built for accessing emails. Mozilla quickly incorporated this as the XMLHttpRequest object in their browser. I dont know what made the Mozilla team incorporate the object but it stayed dormant until Google came up with Gmail.

Google’s Lead Role
Gmail was the first most interactive web based email client which actually used the XMLHttpRequest to make a rich internet interface providing asynchronous behavior thus making the email client more user friendly than any other in those days of 2004. People took this notice and came up with similar stuff since Gmail rose into popularity charts in an instant.I would also attribute that Gmail was the first to amaze the users with its 1GB space storage strategy, free of cost ,which further contributed to its success. Rediffmail took the tips and silently went to announce its rich interface through the use of XMLHttpRequest. Google’s eye widening usage of the XMLHttpRequest in their lab product Google Suggest made the world sit up and take notice of what power could be unleashed with bringing in mere asynchronicity in a web page. Googles Personlize took a leap further by bringing in the drag and drop aspect of JavaScript and a seamless integration with the asynchronous behavior of XMLHttpRequest. This integration was a revolution in itself. Now if you see a page which sports AJAX but without a drag and drop provision you would not probably believe its claim!!

A more frequent use of XMLHttpRequest was shown in the form of the star rating in Google’s orkut, a social networking site, which currently tops the list in the most popular social networking site in history, where a user just had to click the star, to rate the person. This usage can also be seen in Gmail to mark the mails of more importance and separate them out from regular ones. Surely the use of XMLHttpRequest was so tremendous that Google came up with Google Maps, for users to locate and view places on any point across the world all in the same browser which sometimes they probably cursed due to the slow loading web pages. The maps concept was received with tremendous uproar and many vendors started their own versions eg: Yahoo maps, Microsoft Live Maps etc. Google’s stand with XMLHttpRequest has truly laid out the foundation for how AJAX is being used today. In short, Google is the father of all AJAX inventions!!

War of the worlds

History was being created and for good and people were pleased to see more of it daily and amazingly vendors were luring them right on this very opportunity they got. But this altogether bought in a different sort of cold war between the web designers who didn’t use more of scripts as it hampered the website’s success. Those were the days when scripts were considered harmful and users were advised to turn off the script execution in their browsers. You would now be the odd man out if your browser was set to turn off the script execution because not many sites would function with its functionality turned off. Nowadays most of the sites rely on the use of AJAX and I would be probably right in saying that one day browsers would no longer incorporate the script switch-off setting. As for the cold war, it quickly went to the hands who were fluent with scripting. JavaScript was taking the charge.

But in between the script developers themselves, debates were rising for the amount of hacks being introduced for supporting the XMLHttpRequest in different browsers. Mozilla’s version of the XMLHTTP was a sure shot success since it was a native object to the browser and developers made this as their holy grail. Mozilla was then a far more better browser due to its amazing customizable features and introduction of tabs as compared to Microsoft’s Internet Explorer. Microsoft kept its silence on the very aspect that they themselves had invented . This still baffles me. Other browser’s like Opera didn’t support the XMLHttpRequest object so it was never in the competition. Microsoft fell the heat rising high for the need of the XMLHttpRequest revolution that it had to reluctantly change the XMLHTTP object from its list of ActiveX objects to a browser native object much in the similar manner as Mozilla had incorporated, in Microsoft’s latest offering of Internet Explorer aka IE 7. Other browsers followed a similar approach.

The birth of AJAX

Till now I havent used the term AJAX more often than XMLHttpRequest. Of course invention of the XMLHttpRequest object made AJAX possible but you would ask me, whats this whole AJAX hype if only XMLHttpRequest did all the goody stuff. The birth of AJAX actually took place through an article written by Jesse James Garrett who is the founder of Adaptive Path. Jesse, in his article, defined AJAX as

Ajax isn’t a technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates:

• standards-based presentation using XHTML and CSS;
• dynamic display and interaction using the Document Object Model;
• data interchange and manipulation using XML and XSLT;
• asynchronous data retrieval using XMLHttpRequest;
• and JavaScript binding everything together.

Jesse’s articles ignited the whole of the web world and a new acronym to a bunch of technologies was born, namely AJAX and the rest as they say is history. It became easier to refer to the bunch of underlying technologies and some developers were relived since the technologies such as CSS, XSLT, DOM didn’t come into immediate picture when AJAX was mentioned. It just highlighted the terms JavaScript and XML.Thats the main reason why some web developers think that making web sites AJAX supportive is to plainly incorporate HTML (which is a form of XML) asynchronously via JavaScript. This concept is thoroughly wrong and should be taken notice. AJAX may be related to the heavy usage of JavaScript and XML but it also means you should know CSS, JSON, HTML DOM and DHTML (dynamic manipulation of HTML DOM) properly for unleashing the true power of the simple XMLHttpRequest object which today has become the de facto standard of web development. Without the technologies together, you just would be bringing a wrong meaning to the term, AJAX.

The birth of AJAX has changed the whole concept of the web being used just for web sites and for good. You can now see OS paradigms becoming popular on the web as Web OS. The fact that Microsoft changed its XMLHTTP ActiveX object to XMLHttpRequest browser native object in IE7 itself says that AJAX is rising high and sky is the limit for the amount of creativity you can impart to a pale looking website. Languages starting coming up with internal support for AJAX integration. Ruby - the never heard of language became the coolest dude in the web world with the Rails framework due to incorporation of AJAX in it. Microsoft hastily started the Atlas framework due to the increasing need of RAD process in AJAX which was in earlier days of 2004 was provided by simple frameworks like Prototype, DOJO, Script.aculo.us etc.

The saga continues

This was the journey of AJAX which continues yet further to scale to further heights. The fact yet remains that methodologies of AJAX long existed before the word AJAX took over them. I wont be wrong if I said AJAX is a mashup of technologies. Today AJAX has made it possible to bring the unimaginable to reality. Be it the millions of mashups using different technologies viz. Web services, Syndications, Maps, Wikis, Tags or the frameworks and IDES springing up each single day, one should always think of the original players viz Google and Microsoft, who made it turn into such a big aspect of what we put forward as Web 2.0, and get inspired to leverage it still further.

GWT 2.0 Comes with a New Performance Tool: Speed Tracer

GWT 2.0’s new features are: Speed Tracer – a performance analysis tool, Development Mode, UiBinder, Layout Panels and more JavaScript code size optimizations.

Speed Tracer (ST), built using GWT, is the most attractive  GWT addition. Speed Tracer is a performance analysis tool for Chrome, being used to analyze any web application, not just GWT ones. ST comes as a Chrome extension so the in-development Chrome 4.0 must be used to install it.

ST contains two main views: sluggishness and network. The first shows how responsive the UI is over time, while the second displays the network activity over the same period of time. Start/Stop/Record commands are available to facilitate analyzing a certain period.

Some other important new features in GWT 2.0 are:

Development Mode (DM)

• A new GWT Developer Plug-in allows debugging a GWT application in any browser. That means having the ability to combine GWT debugging with the preferred tools in the browser of choice, like Firebug in Firefox.
• Multiple different browsers can be monitored in one session. 
• DM works not just locally but also across the network to test a web application on any browser-OS combination and in a real environment.
• A new GWT Eclipse plug-in integrates the development mode: starting and controlling it plus displaying debug messages inside Eclipse. The development mode can be attained in any other Java IDE not just Eclipse.

UiBinder is a declarative method to create GWT-based UIs. The widgets composing an interface are declared in a template XML file and are associated with Java classes. This results in the much desired separation of UI and business logic. The GWT Eclipse plug-in contains a wizard assisting the developer with boilerplate code plus code completion, squiggles, and refactoring.

The UiBinder template can include the associated CSS widget style. That means a particular widget can be used across different applications with the exact look and feel.

Layout Panel

The introduction of a CSS-based layout panels makes it possible to create an application that looks exactly the same on any browser, a realization that was very difficult to attain before. The Mail Sample application demonstrates that. The UiBinder can be used to layout panels too.

Compiler

GWT 2.0 introduces code splitting. That means that the compiled code can be split in two or more pieces. This allows the application to be started without having to wait until the whole application is loaded. Splitting is done by creating as many split points as desired by calling GWT.runAsync(). The compiler makes sure all necessary dependencies are loaded for a piece of code.

The generated JavaScript code has been further optimized in size by 3-20%.

GWT is an open source project  licensed under Apache License, v. 2.0, an SDK, Speed Tracer and the Eclipse plug-in being available for free.

Enjoyyyyy….