Some History

A while ago I came to realization that XML is only one of many possible representation formats for sending structured data over HTTP. One of my first successful projects of this nature was in 1999 when we were web-enabling one of the classical Windows client-server applications. Sometime after project completed I attended "Objects versus The Web" tutorial by Naci Dai and Alan Knight on OOPSLA of 2001. The tutorial was discussing the very issue of appropriate object representations suitable for the web use. After the tutorial, we had a long talk with Alan, where I showed him some of my work on generating web pages client-side using JavaScript and JavaScript data-objects. Later that day, we invited Martin Fowler and talked about the approach some more.

The approach was to generate web page content on the client side (in the web browser) by rendering JavaScript data-objects with JavaScript. It looked quite ordinary and we did not see anything out of the ordinary there. Alan continued to think it was kind of cool and wrote about it and even included it in one of the Objects versus The Web presentations. I moved onto other, non web related things and topic got idle for a while.

Essential Parts of AJAX acronym

Now we have AJAX everywhere. The old idea for some reason looks very cool now. At the same time I want to share with you the old news that AJAX works quite well without XML! The AJAX acronym consists of three key words: asynchronous , JavaScript and XML. The XML part of the acronym is quite misleading and forces lots of people into XML parsing nightmares. What XML part really stands for is "some kind of structured response from server". And structured response can come in many flavors, some being more powerful than XML.

If you want to get rid of XML in AJAX just don't to send XML as a response. You can send anything else! Here is an example of AJAX without XML, where server instead of XML sends a body of JavaScript function created by a JSP page. This body is then evaluated by the browser with eval() function.

Listing 1. A text of JavaScript function is created on the server by data/oyJavaScriptLambda.jsp servlet.

<%@ page language="java" import="java.util.*" %>
<%  Date date = new Date(); %>
    alert("The server time is: <%=date%>");

Listing 2.Browser evaluates a text of JavaScript function returned by the server as a response to XMLHttpRequest.

	// XMLHttpRequest completion function
	var myOnComplete = function(responseText, responseXML){
		eval(responseText);
	}

There are other things one can return in response to XMLHttpRequest. One can return a definition of JavaScript objects that can be then used to render the page. These objects can be true JavaScript objects. Please compare below XML response and JavaScript objects or JSON response. You are free to choose the one you like the most.

Listing 3.Server response expressed as XML.

	<?xml version="1.0" encoding="ISO8859-1" ?>
	<breakfast-menu>
	  <food>
	    <name>Belgian Waffles</name>
	    <price>$5.95</price>
	    <description>two of our famous Belgian Waffles with 
	      plenty of real maple syrup</description>
	    <calories>650</calories>
	  </food>
	  <food>
	    <name>Strawberry Belgian Waffles</name>
	    <price>$7.95</price>
	    <description>light Belgian waffles covered with strawberrys 
	      and whipped cream</description>
	    <calories>900</calories>
	  </food>
	</breakfast-menu>

Listing 4.Server response expressed as JavaScript objects.

	function Food(name, price, description, calories){
		this.name = name;
		this.price = price;
		this.description = description;
		this.calories = calories;
	}
	
	var breakfastMenu = new Array();
	
	breakfastMenu[0] = new Food(
		"Belgian Waffles", 
		5.95, 
		"two of our famous Belgian Waffles with plenty of real maple syrup",
		650
	);
	
	breakfastMenu[1] = new Food(
		"Strawberry Belgian Waffles", 
		7.95, 
		"light Belgian waffles covered with strawberrys and whipped cream",
		900
	);

Listing 5.Server response expressed as JSON objects.

	{"breakfast-menu": {
		"food":[
			{"name": "Belgian Waffles", 
			 "price": "5.95", 
			 "description": "two of our famous Belgian Waffles with ...", 
			 "calories": "650"
			},
			{"name": "Strawberry Belgian Waffles", 
			 "price": "7.95", 
			 "description": "light Belgian waffles covered with ...", 
			 "calories": "900"
			}
		]
	}}

One can call eval() on this response. After this eval() a breakfastMenu object can be used to update parts of the web page or to create new sections of the web page.

Listing 6.Use JavaScript objects defined in server response.

	// XMLHttpRequest completion function
	var myOnComplete = function(responseText, responseXML){
		eval(responseText);

		for (var i=0; i < breakfastMenu.length; i++){
			document.write(breakfastMenu[i].name + "<br>");
		}
	}

XML is not a bad representation, do not get me wrong. But other representations are possible, potentially more powerful. XML is quite expensive to parse, so people will continue to look for alternatives. There can be other representations of server-side information that makes sense to return as part of XMLHttpRequest. This year at OOPSLA 2005 I have heard from several people that they “generate JavaScript” of the server side. This is a strong hint that there are people out there looking at AJAX but without XML…

The examples in this article use oyXMLRPC.js library from my article Javascript Refactoring. This library does nothing more, but encapsulates XMLHttpRequest .

References

1. OOPSLA 2001 Report
2. Objects versus The Web
3. JSON (JavaScript Object Notation)

Finding the right credit card processing company is as important as domain name registration for choosing your domain but cheap vps deals are easier to find.