JSON or XML, Which Format to Choose?

With this comparison of JSON and XML, we will attempt, by highlighting the strengh and the weakness of each format, to help you to choose the right one for a given application, and especially for an Ajax application.

JSON

JSON is a recursive format compatible with JavaScript and that actually is similar in structure to a JavaScript object. It is an object stored into a file. It dates back to 2002 and suddently gained popularity when Ajax become widely used.

JavaScript

To use a JSON file, you have just to load the file as a text, this is the content of the responseText attribute in Ajax.
Then you use the eval() JavaScript function to transform it into JavaScript object:

var doc = xhr.responseText;
var jdoc = eval('(' + doc + ')');

Once the file is parsed, it is used as any JavaScript object:

var value =  jdoc.commands[0].value;
var action =  jdoc.commands[0].action;
Several scripts are available on the Web to serialize a JavaScript object into a JSON file. One is provided on the website of the author (see resources).

PHP

You can use JSON in PHP once parsed with a PHP parser. See at resource for a such tool.
A PHP library exists for JSON, you have just to configure php.ini to use it. There is also a json.php library to include directly with the "require" function.

Web service

The JSON Web service library is very popular. It is even supported by the new Silverlight 1.1 virtual machine.

Transformations

Transformation from a format to another one is accomplished by serializing the object in memory into the new format.

Advantages

JSON is very easy to use in JavaScript, it is a part of the language.

Drawbacks

JSON presumes you know the structure of the document. When used in any programming language, data are used through the structure of an object

XML

XML is a markup language that is the base format of a lot of standards: RSS, RDF, OPML, XHTML, Open XML, etc. It allows to describe and analyze any kind of documents, but binary ones, and store them into a file.
It is more verbose than JSON, but a lot of tools are available to process it and it is also the format of documents for word processors and other desktop software.

JavaScript

Unlike JSON, the file is loaded in Ajax directly as an XML document, this is the responseXML attribute of Ajax.
The content is then accessed by DOM's methods.

var xdoc = xhr.responseXML;
var x = xdoc.getElementById("sometag");

PHP

XML is part of the core PHP 5 language, it is used directly in PHP through the DOMDocument class and the SimpleXML class. You can load an XML file, process it with DOM's methods and save it directly into a file.

Web service

This is an XML format for Web service: SOAP. It is a W3C standard but rather intricate and not very popular.

Transformations

Transformation from an XML document to another format may be accomplished via XSLT, not a very easy to use tool. Of course you can also in PHP or JavaScript, load the XML file, get the data and build a file in another format, in some cases this is more easy.

Advantages

The structure of XML is free. Any textual content can be expressed in XML and accessed by ID or name.

Drawbacks

Using DOM's method may be tedious in some cases.
The format is verbose and consumes lot of space.

Conclusion

JSON is simpler to get data from the server and use it as a persistent memory for a program. You have to know the structure of the data to use it, you must be the owner of the data file preferably.
It is lighter than XML and save resources.

XML is better for presentation purpose. It is the language of all graphical user interfaces for now: XAML, XUL, MXML, etc. In this case, the data is stored in a form and used in another form.
You can use XML from external sources. The combination of XML and XPath allow to use XML as database, it is thus convenient for large resources.

Examples

Example of JSON file

[ { 
"menu": "File", 
"commands": [ 
 {
    "value": "New", 
    "action":"CreateDoc"     
 },
 {
    "value": "Open", 
    "action": "OpenDoc" 
}, 
{ 
    "value": "Close", 
    "action":  "CloseDoc"
 } ]
 } ]

Example of XML file

<?xml version="1.0" ?>
<menubar>
   <menu name="File">
      <command value="New" action="CreateDoc" />
      <command value="Open" action="OpenDoc" />    
      <command value="Close" action="CloseDoc" />
   </menu>
</menubar>

This is actually a compact form, to reflect exactly the object you should write instead:

<command>
    <value>
        New
    </value>
    <action>
        CreateDoc
    </action>
</command>

Resources

(c) 2007 Denis Sureau. Scriptol.com