Introducing the Google AJAX APIs, Page 4
The AJAX APIs Layered Architecture
Here is how the AJAX APIs along with their respective UI controls are layered:
Click here for a larger image.
Figure 5: The AJAX APIs Layered architecture at a glance
As you can see in Figure 5, The AJAX APIs have a layered architecture. Here's a more thorough description of each layer starting at the lowest level:
- Base UI Layer: The base UI layer provides some very basic User Interface technology out of the box. At this layer, one doesn't need to resort to low-level JSON parsing or DOM manipulation. He can simply use some basic User Interface controls such as the FeedControl as is and let it do the work of communicating back to the server to pull down data and display it.
- Advanced UI Layer: The Advanced UI Layer provides the highest level of sophistication and specialization from the AJAX APIs. At this level exist UI controls that are specialized to provide a specific solutions such as a Google Maps and Search mashup, a Video Bar, or for the Feed API, a SlideShow, or Itunes Bar.
The Raw Data Access Layer
A good demonstration of programming at the Raw Data Access Layer can be shown with the AJAX Feed API. Instead of using the powerful FeedControl, it is possible to to extract the Feed data directly and write your own code to display the fields. This is useful if you want be in 100% full control of how your data renders. In this Raw Data Access Layer version of a AJAX Feed Hello World example, you see how to pull down a feed from digg.com, extract the title element, and display it onto the page using DOM programming.
|Note: It's important to remember that this is an example of accessing the raw data at its lowest level. As shown elsewhere in this article, the AJAX Feed FeedControl widget, which is not used in the previous code example, actually performs the task of rendering the feed data into the page, but more on that later...|
A quick inspection of the preceding code shows how the feed is loaded and a callback function is registered to handle the incoming feed results. The function iterates through the feed entries and, for each entry title, it appends the text of the title to a <div> container. Incidentally, the entry.title element is one of several elements made available via the canonicalized or unified JSON output of the AJAX Feed API. Why is it unified? For the simple reason that the AJAX Feed API serves several versions of both the RSS and Atom feed formats and with a unified version, programmers can just use a single set of elements and be guaranteed that it will work for multiple feed types. This allows for extreme flexibility when pulling down feed data of different formats.
Page 4 of 6