JSON vs XML parsing performance


JSON vs XML parsing performance

Published on Mon 01 Oct 2007 05:10 ( 6 years, 9 months ago)
Javascript

In one project I worked on is using XML format to pass data and handle them inside HTML web page with a MSXML parser object. I was thought if I pass the data in JSON format directly could be faster. However, after I wrote a simple test code to verify the idea, I found I was wrong.

I believe it’s because XML parsing is inside MSXML object and JSON parsing is using Jscript engine which have more overhead.

<html>
<head>
<title>JSON vs XML parse performance in browser</title>
<script>

function out(str)
{

  var o = document.getElementById("output");

  if (o!=null)
    o.innerHTML += str + "<br/>";

}

function generateJSON(size)
{
  var strJSON = "[";
  ch = '';
  for (i = 0 ; i < size; i++)
  {
   strJSON += ch + '{"filename":"file' + i + '.html"}';
   ch = ',';
  }
  strJSON += ']';

  return strJSON;
}

function generateXML(size)
{
  var strXML = "<?xml version='1.0' encoding='UTF-8'?>";

  strXML += "<files>";

  for ( i = 0 ; i < size; i++)
   strXML += "<file name='file" + i + ".html' ></file>";

  strXML += "</files>";
  return strXML;
}

function parseJSON(str)
{
  data =  eval('(' + str + ')');
  out(data.length + " data parsed");  
}

function parseXML(str)
{
  var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
  xmlDoc.loadXML(str);

  if (xmlDoc.documentElement!=null)
  {
    var files = xmlDoc.documentElement.childNodes;
    out(files.length + " data parsed");
  }
  else
  {
    out("Invalid XML parsed");
  }
}

function testJSON()
{
  var datasize = document.getElementById("datasize").value;
  out("generating JSON for test...");

  str = generateJSON(datasize);

  out("begin parse JSON...");

  var begin = new Date();
  parseJSON(str);

  var end = new Date();
  out("Parse JSON data with " + datasize + " records, used time: " + (end - begin) + "ms");

}

function testXML()
{

  var datasize = document.getElementById("datasize").value;

  out("generating XML for test...");
  var strXML = generateXML(datasize);

  out("begin parse XML...");

  var begin = new Date();
  parseXML(strXML);

  var end = new Date();
  out("Parse XML data with " + datasize + " records, used time: " + (end - begin) + "ms");

}

</script>
<head>

<body>

Lines of data: <input type="edit" value="100" id="datasize"></input>
<input type="button" onclick="testJSON()" value="Test with JSON"></input>
<input type="button"  onclick="testXML()" value="Test with XML"></input>

<hr/>

<div id="output">
</div>
</body>
</html>

Here is a result:

generating JSON for test...
begin parse JSON...
10000 data parsed
Parse JSON data with 10000 records, used time: 31ms
generating XML for test...
begin parse XML...
10000 data parsed
Parse XML data with 10000 records, used time: 16ms

generating JSON for test...
begin parse JSON...
20000 data parsed
Parse JSON data with 20000 records, used time: 78ms
generating XML for test...
begin parse XML...
20000 data parsed
Parse XML data with 20000 records, used time: 47ms

Feedback are welcome...


Related posts:


Search related in web:

Custom Search

RSS Feed

One click subscribe this blog in your google reader!

Be social!


Want to say something here? please sign in



Blog posts link to this page
Tags cloud
Monthly Archives