Why is Everyone Choosing JSON Over XML for jQuery? [closed]

Answer 1

Just an anecdote from my own personal experience:

I wrote a small Javascript directory, first with the data in XML, and then adapted it to use JSON so I could run them side-by-side and compare speeds with Firebug. The JSON ended up being approximately 3 times faster (350-400 ms vs. 1200-1300 ms to display all data). Also, as others have noted, the JSON is much easier on the eyes and the file size was a good 25% smaller due to the leaner markup.

Answer 2

Easily parsed by JavaScript and it is lightweight (a document in JSON is smaller than a XML document that contain the same data.)

Answer 3

Now that there are JSON encoders and decoders for most languages, there's no reason NOT to use JSON for uses where it makes sense (and that's probably 90% of the use cases for XML).

I've even heard of JSON strings being used in large SQL databases to make schema changes easier.

Answer 4

I'm no expert by far but from the various companies I've worked for we generally use XML in small data environments or configuration values (web.config is a great example).

When you have large amounts of data, generally, you will want to report on that data. And XML is not a great source for reporting. In the grand scheme of things, it seems as though a transactional database is easier to report/search against than XML.

Does this make sense? As I said above, I'm no expert but from my experience this seems to be the case. Also, I believe Microsoft integrated JSON support due to the wave of developers moving over to client-side or scripted actions to enhance the visuals of the UI (Ajax) and Microsoft's Ajax has not been used as much as other libraries like jQuery and MooTools (Yahoo's YUI is also in that mix) due to their beautiful integration of serializable objects using JSON.

I find myself writing code now implementing the JSON serializer in my VB code. It's WAY too easy and from an upgrading/modifying standpoint, you can't beat it. It's Microsoft's way of keeping us addicted to VS I guess. I have recently converted an enterprise application to using Ajax (via jQuery) and using JSON format. It took approximately 2 weeks to do so. I actually thank Microsoft for integrating it because without it, I would have had to write quite a bit of extra code.

Answer 5

JSON is best for consumption of data in web applications from webservices for its size and ease of use, especially due to the built-in support in JavaScript. Imagine the computation overhead for parsing an xml fragment compared to the instant lookup in JSON.

A very good example is JSON-P. You can get back data from a webservice wrapped in a callback function call, like my_callback({"color": "blue", "shape":"square"}); inside a dynamically generated <script> tag so the data can be directly consumed in the function my_callback(). There is no way to get even close to this convenience using XML.

XML would be the format of choice for large documents, where you have a framework of rendering pages of data in multiple formats using XSLT. XML can also be used with application configuration files for readability among many other uses.

Answer 6

It's lightweight compared to XML. If you need to scale, reduce your bandwidth requirements!

Compare JSON

 [
      {
           color: "red",
           value: "#f00"
      },
      {
           color: "green",
           value: "#0f0"
      },
      {
           color: "blue",
           value: "#00f"
      },
      {
           color: "cyan",
           value: "#0ff"
      },
      {
           color: "magenta",
           value: "#f0f"
      },
      {
           color: "yellow",
           value: "#ff0"
      },
      {
           color: "black",
           value: "#000"
      }
 ]

to XML:

 <colors>
      <color >
           <name>red</name>
           <value>#f00</value>
      </color>
      <color >
           <name>green</name>
           <value>#0f0</value>
      </color>
      <color >
           <name>blue</name>
           <value>#00f</value>
      </color>
      <color >
           <name>cyan</name>
           <value>#0ff</value>
      </color>
      <color >
           <name>magenta</name>
           <value>#f0f</value>
      </color>
      <color >
           <name>yellow</name>
           <value>#ff0</value>
      </color>
      <color >
           <name>black</name>
           <value>#000</value>
      </color>
 </colors>