Thursday, April 16, 2009

RSS - XML == jsonSS

I recently attended The Server Side Symposium in Las Vegas and attended a couple of sessions with Scott Davis from Thirst Head. He had a couple of great sessions on Groovy and JSON. I must say that Scott is an amazing presenter, if you ever get a chance to see him speak or need training I would highly recommend this guy. He is highly engaging and exciting to listen to. ( No he didn't ask for the endorsement. I just thought he was pretty rad. ) Anyways, so after attending the session "JSON in the Real World" I started to think about how JSON could make every web developers' life a TON easier. I had recently written some code to parse an RSS feed and thought to myself how annoying and overly complex it is. There is really no reason to deal with parsing XML in JavaScript.

So I have been thinking about RSS feeds and how they are used and the hoops that everyone has to jump through just to display them on a web page. Usually this requires some sort of server side process to fetch the feed and then return that to the page that is being rendered. Basically proxying the call to get around browser security issues. Or you have to make the call to fetch the feed when the page is loading. No big deal really. But then you have to parse the XML.

Sample RSS 2.0 response:

<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>RSS Example</title>
<description>This is an example of an RSS feed</description>
<link>http://www.domain.com/link.htm</link>
<lastBuildDate>Mon, 28 Aug 2006 11:12:55 -0400 </lastBuildDate>
<pubDate>Tue, 29 Aug 2006 09:00:00 -0400</pubDate>

<item>
<title>Item Example</title>
<description>This is an example of an Item</description>
<link>http://www.domain.com/link.htm</link>
<guid>1102345</guid>
<pubDate>Tue, 29 Aug 2006 09:00:00 -0400</pubDate>
</item>

</channel>
</rss>


The XML is not difficult to read or understand. It is pretty straight forward as to what is being conveyed. We can all agree on that. But then we have parse this response. Lets look at how ugly this really is. Here is just a snipet from XML.com:

function RSS2Channel(rssxml)
{
/*required string properties*/
this.title;
this.link;
this.description;

/*optional string properties*/
this.language;
this.copyright;
this.managingEditor;
this.webMaster;
this.pubDate;
this.lastBuildDate;
this.generator;
this.docs;
this.ttl;
this.rating;

/*optional object properties*/
this.category;
this.image;

/*array of RSS2Item objects*/
this.items = new Array();

var chanElement = rssxml.getElementsByTagName("channel")[0];
var itemElements = rssxml.getElementsByTagName("item");

for (var i=0; i<itemElements.length; i++)
{
Item = new RSS2Item(itemElements[i]);
this.items.push(Item);
}

var properties = new Array("title", "link", "description", "language", "copyright", "managingEditor", "webMaster", "pubDate", "lastBuildDate", "generator", "docs", "ttl", "rating");
var tmpElement = null;
for (var i=0; i<properties.length; i++)
{
tmpElement = chanElement.getElementsByTagName(properties[i])[0];
if (tmpElement!= null)
eval("this."+properties[i]+"=tmpElement.childNodes[0].nodeValue");
}

this.category = new RSS2Category(chanElement.getElementsByTagName("category")[0]);
this.image = new RSS2Image(chanElement.getElementsByTagName("image")[0]);
}


While this example is a bit more involved than what we really need to read the example feed that is outlined above, you can see how this simple syndication becomes really annoying. This code isn't even complete, as you can see. Some other objects are being created to deal with different elements. This is all very OO and what not, but look at how complex this gets.


So let's take the feed and convert it over to what it might look like in JSON. If you don't know what JSON is I suggest you got check out JSON.org and read about it.

So we can see below how all of the same elements and values could be displayed in JSON as in the XML format. Pretty simple here and straight forward.


{rss: version: "2.0", encoding: "UTF-8"
channel: {
title: "RSS Example",
description: "This is an example of a JSON-S Feed",
link: "http://someurl.com"
lastBuildDate: "Mon, 28 Aug 2006 11:12:55 -0400",
pubDate: "Tue, 29 Aug 2006 09:00:00 -0400",
items: [
{
title: "Item Example",
description: "This is an example item",
guid: "1102345",
pudDate: "Tue, 29 Aug 2006 09:00:00 -0400"
}
]
}
}


Let us now look at how you might 'parse' this sort of response.


function parseJSONFeed(jsonFeed) {
var version = jsonFeed.version;
var encoding = jsonFeed.encoding;
var channel = jsonFeed.channel;
var title = channel.title;
var description = channel.description;
...
var items = channel.items;
for ( i = 0; i < items.length; i++ ) {
items[i].title; //do something with the info here
items[i].description
...
}

}


Now you can see how some huge undertaking to parse an RSS feed quickly becomes something of the past. Simply replacing the the RSS feed's XML with JSON makes your life much simpler. Now you no longer have to create a parser or all the other associated objects that you may need. Simply access the attributes using 'dot' notation.

This all boils down to a proposal to make a new standard of jsonSS. JavaScript Object Notation Simple Syndication.