概念
XML
擴展標記語言 (Extensible Markup Language, XML) ,用於標記電子文件使其具有結構性的標記語言,可以用來標記數據、定義數據類型,是一種允許用戶對自己的標記語言進行定義的源語言。 XML使用DTD(document type definition)文檔類型定義來組織數據;格式統一,跨平台和語言,早已成為業界公認的標准。
XML是標准通用標記語言 (SGML) 的子集,非常適合 Web 傳輸。XML 提供統一的方法來描述和交換獨立於應用程序或供應商的結構化數據。
http://www.cnblogs.com/SanMaoSpace/p/3139186.html
XML規范:
https://www.w3.org/TR/REC-xml/
例子.
XML數據格式樣例:
<employees> <employee> <firstName>Bill</firstName> <lastName>Gates</lastName> </employee> <employee> <firstName>George</firstName> <lastName>Bush</lastName> </employee> <employee> <firstName>Thomas</firstName> <lastName>Thomas</lastName> </employee> </employees>
JSON
JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式,采用完全獨立於語言的文本格式,是理想的數據交換格式。同時,JSON是 JavaScript 原生格式,這意味着在 JavaScript 中處理 JSON數據不須要任何特殊的 API 或工具包。
http://www.cnblogs.com/worfdream/articles/1956449.html
JSON規范:
http://json.org/
例子.
JSON數據格式樣例:
{ "employees": [ { "firstName": "Bill", "lastName": "Gates" }, { "firstName": "George", "lastName": "Bush" }, { "firstName": "Thomas", "lastName": "Carter" } ] }
對比
效率實驗對比
以概念章節中JSON的例子數據為研究對象, 構造同等的XML數據:
以這兩個數據考察,它們分別在相同瀏覽器中的解析時間,和 查詢時間:
在firefox瀏覽器中:
1、 解析1000次;
2、 查詢第二個員工lastName,10000次。
針對兩個數據分別構造頁面腳本,分別跑5次,實驗結果如下:
XML
| 項目 次數 |
1 |
2 |
3 |
4 |
5 |
平均 |
| 解析 |
1646 |
1656 |
1608 |
1650 |
1661 |
1644.2 |
| 查找 |
10 |
10 |
10 |
11 |
11 |
10.4 |
單位(ms)
JSON
| 項目 次數 |
1 |
2 |
3 |
4 |
5 |
平均 |
| 解析 |
4 |
4 |
3 |
3 |
3 |
3.4 |
| 查找 |
1 |
1 |
1 |
1 |
0 |
0.8 |
單位(ms)
總結,JSON的效率遠遠高於xml,解析效率是xml的484倍,查找效率是13倍。
數據量對比
調查對於同一份數據信息,使用XML描述和JSON描述數據量差別對比。
以效率實驗中的數據為對象,統計結果:XML是JSON的1.71倍。
XML: 263Byte
JSON: 154Byte
JSON對於相同信息的描述,比XML更加省數據量,比XML省42%,傳輸更快。
特性對比
|
|
XML |
JSON |
| 可讀性 |
高 |
高 |
| 可擴展性 |
高 |
高 |
| 編寫容易度 |
中 |
高 |
| 查找容易度 |
低 |
高 |
| 流行度 |
高 |
中 |
| 數據描述能力 |
高 |
中 |
| 安全性 |
高 |
中 |
說明:
1、 關於流行度,XML已經被業界廣泛的使用,而JSON才剛剛開始,但是在Ajax這個特定的領域,未來的發展一定是XML讓位於JSON。到時Ajax應該變成Ajaj(Asynchronous Javascript and JSON)了。
2、 關於安全性,由於大部分Javascript庫都是使用eval()來解析數據,存在執行惡意JSON數據的安全漏洞;當然可以使用專門的JSON解析器來避免這個問題。相比,XML更安全一些。
參考:
https://blog.tanteng.me/2012/09/json-xml-compare/
http://www.cnblogs.com/SanMaoSpace/p/3139186.html
綜上所述,XML由於其誕生時間早,相對成熟,在流行度、數據描述能力、安全性相對較高,其它特性JSON較高或者相同。其中編寫和查詢容易度,關系到開發體驗,能提高開發效率,JSON優於XML。
效率實驗
json
<!doctype html> <html> <head> </head> <body> <script type="text/javascript"> function hereDoc(f){ return f.toString().replace(/^[^\/]+\/\*!?\s?/, '').replace(/\*\/[^\/]+$/, ''); } var jsonstring = hereDoc(function(){/* { "employees": [ { "firstName": "Bill", "lastName": "Gates" }, { "firstName": "George", "lastName": "Bush" }, { "firstName": "Thomas", "lastName": "Carter" } ] } */}); // 統計解析耗時 var starttime = (new Date()).getTime(); for (var i = 0; i < 1000; i++) { JSON.parse(jsonstring); }; var endtime = (new Date()).getTime(); console.log("parsing consume time ="+(endtime - starttime)) // 查詢第二個成員lastName var starttime = (new Date()).getTime(); var jsonObj = JSON.parse(jsonstring); //console.log("lastName = "+lastName) for (var i = 0; i < 10000; i++) { var lastName = jsonObj.employees[1].lastName }; var endtime = (new Date()).getTime(); console.log("finding consume time ="+(endtime - starttime)) </script> </body> </html>
xml
<!doctype html> <html> <head> </head> <body> <script type="text/javascript"> function hereDoc(f){ return f.toString().replace(/^[^\/]+\/\*!?\s?/, '').replace(/\*\/[^\/]+$/, ''); } function GetXMLParseFunc() { if (window.DOMParser) { var parser=new DOMParser(); return function (xmlstring) { return parser.parseFromString(xmlstring,"text/xml"); } } else // Internet Explorer { console.log("not support DOMParser"); // xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); // xmlDoc.async="false"; // xmlDoc.loadXML(txt); } } var xmlstring = hereDoc(function(){/* <employees> <employee> <firstName>Bill</firstName> <lastName>Gates</lastName> </employee> <employee> <firstName>George</firstName> <lastName>Bush</lastName> </employee> <employee> <firstName>Thomas</firstName> <lastName>Thomas</lastName> </employee> </employees> */}); var parseFunc = GetXMLParseFunc(); // 統計解析耗時 var starttime = (new Date()).getTime(); for (var i = 0; i < 1000; i++) { parseFunc(xmlstring); }; var endtime = (new Date()).getTime(); console.log("parsing consume time ="+(endtime - starttime)) // 查詢第二個成員lastName var starttime = (new Date()).getTime(); var xmlObj = parseFunc(xmlstring); for (var i = 0; i < 10000; i++) { var lastName = xmlObj.getElementsByTagName("employee")[1].getElementsByTagName("lastName")[0].childNodes[0].nodeValue //console.log("lastName = "+lastName) }; var endtime = (new Date()).getTime(); console.log("finding consume time ="+(endtime - starttime)) </script> </body> </html>
