Step Two: Lay out the components on the canvas
Next drag-and-drop a "Top/Over layout container" from the System Component Library onto the canvas. Add a label in the top pane and add the text label "World Oil Consumption (Thousand barrels daily)" in it. Also add a Matrix component in the bottom pane. Delete the columns that are added by default, and add the columns (of the Text HTML type) for this example. The key properties of the Matrix and its columns for this example are:
Properties of the Matrix component:

• Clear the XML String that's added in by default
• Set the XML URL to point to the oilconsumption.xml file in the xml folder
• Set the Transformer property to point to xsl/oilconsumptionmatrix.xsl

Properties of the Column components:

1. The Region column will have the caption Region and the Att Name property will be set to Region as well (to match the attribute name Region in the CDF)
2. The Country column will have the caption Country and the Att Name property will be set to Country as well (to match the attribute name Country in the CDF)
3. All year columns will have the caption of the year itself (1965, 1966...2006) and their Att Name properties will be set to y1965, y1966Éy2006 respectively to match the attribute names in the CDF. These columns will also have their Sort Att Type property set to "Numeric"
4. The Value Template property in each year column will have a value template similar to the listing above valuetemplate1966.xsl. All columns have the same value template, except the names of the attributes being compared will be appropriate to each column. So, for example, the test @y1966 > @y1965 will change to @y1967 > @y1966 for the column named y1967 and so on. The matrix displayed in GI Builder should appear as shown in Figure 4.

Step Three: Use the deployment utility to create the HTML page to launch the application
At this point the table is already displayed as expected in the GI Builder tool and easily displays which countries are reducing or increasing their oil consumption. The last step is to create an HTML file to launch the same application outside of GI Builder. Use the deployment utility in the Project menu to create an HTML file. When clicking on the HTML file from Windows Explorer, the application window should appear as shown in Figure 5.

Performance Advantage: Faster Development
Besides GI's runtime performance advantage, its author-time speed shouldn't be overlooked. Authoring speed with GI is driven by three things: a variety of ready-made AJAX components, visual tools for drag-and-drop assembly of GUIs, and connectivity to data services.

GI includes a number of ready-to-use controls and widgets, such as context-sensitive menus, date/time picker, slider, dialog boxes, menu bars, stack groups, layouts, beyond Select, List, Combo box, and Button. All controls have numerous properties that can be manipulated to get the desired look-and-feel. All components are also rendered asynchronously on screen, which means GI makes efficient use of today's powerful processors by rendering in multiple threads. Most controls support the asynchronous loading of data for even faster performance - for example, a Select combo can display "loadingÉ" in the control while fetching the list to display in the control and draw the data as soon as it's available.

TIBCO GI also includes a number of development tools besides GI Builder, such as a JavaScript debugger, allowing users to step through JavaScript code one statement at a time. And there's a data-mapping tool for building XSL transformations without knowing anything about XSL. Just type in the URL of the XML data (or the URL of the WSDL for a Web Service) and the tool retrieves the XML and lets you visually map data elements from XML to individual attributes in the CDF. Then there's an XSL merge utility that can be used to quickly test XSL stylesheets against the data for the application. Finally, there's a performance profiler tool that can be used to identify potential areas of runtime performance improvements.