Dissection of Technologies in JavaScript RIA

In the last entry, I have summarized choices we have while writing a JavaScript RIA (or AJAX application). They are under these seven categories:

1. Communication Model
2. Communication Style
3. Push Communication Style
4. Transportation Protocols
5. Data Format
6. UI Rendering
7. UI Update Style

These categories are actually order in a particular user request:

1. Is it an asychronous or a synchronous?
2. Use iFrame or XHR?
3. Use iFrame or HTTP 1.1 chunked for push data?
4. Data is transmitted with HTTP, XML-RPC, or SOAP?
5. Data is returned in what format (plain text, HTML, JSON, Base64, XML)?
6. The data is the rendered UI or the data values for the client to render the UI?
   
7. Use innerHTML or use DOM to maniuplate the UI?

The combination of the technologies can be summarized in the following graph:

To make any design decision, we may highlight the nodes and paths in the graph in top-down manner. For example, in the case of original AJAX defintion, we may hightlight Asychronous, XHR, HTTP/REST, XML, and Client Side Rendering:

The UI update style is undetermined up to this moment. We can make a complete decision before sending the design to programmers. Designers and programmers may have different preference of AJAX approach. With this simple graph, designers can communicate and synchronize with programmers more effectively. The architect can also use the graph to generate the implementation blueprints for programmers to follow so that more maintainable code can be expected.