Performance Tuning - Chapter 3: Deployment

This chapter describes some important methods during the deployment phase to achieve better performance.

1. Use the production version

The reason for using the production version of the Backbase Client Framework is because the production core is optimized itself. It has no debugging code or extra documentation. The production version is intended for final deployment.

2. Minimize the number of HTTP requests

If the initial loading of a Backbase application is slow, the reason might be there are too many HTTP requests between the server and client. There are two ways to solve this: one is to aggregate all the necessary TDL and BTL definition files, the other way is to use dynamic bindings resolution that only load necessary definition files and load other definition files dynamically in real time.

The following discussion will introduce the first way in two steps: pick up the necessary BTL set and aggregate these TDL/ BTL bindings.

In many Backbase applications, the Backbase Client Framework config.xml file is included. This default file contains xi:include statements for all resource files that are loaded dynamically. However, such dynamic loading requires many HTTP requests for the TDL/BTL definition file. To avoid this, all necessary TDL/BTL definitions could be detected by checking the Firebug (a web development add-on for Firefox) console when loading the page. Here is an example of what you would find in the Firebug console:

image

As it is shown, all necessary files are listed here. The first step is to put them into your own config.xml file. If some files belong to several Backbase namespaces, namespace declarations are needed to wrap the file links. Here is an example:

...//xhtml definition link
...//element.xml definition link
<d:namespace name="http://www.backbase.com/2007/forms">
    ...
    <d:uses element="formBase inputBase inputListBase optionBase messengerBase" src="forms/formsBase.xml"/>
    ...
</d:namespace>
<d:namespace name="http://www.backbase.com/2006/btl" xml:base=".">
    ...
    <d:uses element="dataSource dataContainer dataSchema dataField dataFormatter dataObserver dataPagedObserver" src="dataBinding/dataBinding.xml"/>
    <d:uses behavior="localData" src="dataBinding/localData.xml"/>
    <d:uses element="checkBoxGroup checkBoxGroupOption" src="checkBoxGroup/checkBoxGroup.xml"/>
    ...
</d:namespace>
<d:namespace name="http://www.yourcompany.com/2008/projectname">
    //your own definition
</d:namespace>

The next step is to aggregate all these files together and merge them into one config.xml file. This step can be done manually, using an aggregating tool like ANT build script, or (in the near future) Backbase’s TDL Optimizer.

Another suggestion is to combine in-page HTTP requests. If two components always request data at the same time, then it might be better to combine these two requests and responses together. Backbase data binding techniques can be used to solve this problem. It will centralize the data source and dispatch updates to many data observers for different presentations.

3. Aggregation CSS and JavaScript

If the project contains a lot of CSS files, it is better to aggregate all CSS files together. Put all the "@import" commands in one CSS file and put all related CSS files into that file recursively. Also stripping off comments, redundant space, and empty lines from the source code is a good idea. YUI compressor is a very nice tool for performing this task.

4. CSS Sprites

This concerns the aggregation of all images that will be used in the application. It involves grouping multiple images into one composite image and displaying them using CSS background positioning. Jep also mentions this in his performance
optimization article
.

5. Use Server-side Include techniques

Server Side Includes (SSI) is a simple server-side scripting language used almost exclusively for the web. As its name implies, its primary use is including the contents of one file into another one dynamically when the latter is served by a web server. SSI is primarily used to "paste" the contents of one or more files into another. For example, a file (of any type, .html, .txt, etc.) containing a daily quote could be included into multiple SSI-enabled pages throughout a website by placing the following code into the desired pages:

<!--#include virtual="../quote.txt" -->

See other chapters:

Performance Tuning - Checklist

Performance Tuning - Chapter 1: Architecture and Design

Performance Tuning - Chapter 2: Implementation

Performance Tuning - Chapter 3: Deployment

Performance Tuning - Chapter 4: Server-side Optimization

Performance Tuning - Chapter 5: Testing

Performance Tuning - Chapter 6: Conclusion