This instructions specify how to create a new profile for Dojo as a performance optimization for Struts 2.0.x

Customizing Dojo 0.4.0

Struts 2.0.x includes Dojo 0.4.0 for client-side widgets and ajax functionality. Dojo's default configuration asynchronously loads javascript resources from the server only as they're required, resulting in a small javascript footprint and ease-of-use for developers.

When using the Struts 2 ajax theme, the large series of asynchronous requests performed be Dojo may significantly degrade page-load times. To compensate for this common issue, Dojo includes functionality called Custom Profiles to configure which resources are bundled directly within dojo.js and which should be lazily-loaded.

These instructions describe how to create a Custom Profile for Dojo that includes the Struts 2 widgets and bundle the custom version of Dojo with your Struts 2 application. They're based on the information at http://www.dojotoolkit.org/book/dojo-book-0-4/part-6-customizing-dojo-builds-better-performance and http://www.nabble.com/How-to-improve-dojo-performance-in-Struts-2.0.9-t4579700.html and
http://www.nabble.com/Dojo-custom-build-and-Struts-ComboBox-widget-tf4771621.html

1. Extract Dojo from struts-core-2.0.x.jar

The Dojo files are shipped with Struts 2.0.x within struts2-core-2.0.x.jar. When a request for a resource is received that starts with the /struts URL, the FilterDispatcher serves the corresponding file in struts2-core-2.0.x.jar:/org/apache/struts2/static/. This feature needs to be turned off to use an alternative Dojo profile.

Stop FilterDispatcher from serving static files from the jar

1. Edit struts.properties and set struts.serve.static=false

Copy the static resources out of the jar

1. In your web resources directory, create a directory called struts (ie. this will have the URL /struts)
2. Extract the files in struts2-core-2.0.x.jar:/org/apache/struts2/static/ to /struts

Copy the template resources out of the jar

The Struts 2 templates also include some CSS and javascript files. Copy these 7 files out of the jar as well.

1. Extract struts2-core-2.0.x.jar:/template/simple/dojoRequire.js to /struts/simple/
2. Extract struts2-core-2.0.x.jar:/template/xhtml/styles.css to /struts/xhtml/
3. Extract struts2-core-2.0.x.jar:/template/xhtml/validation.js to /struts/xhtml/
4. Extract struts2-core-2.0.x.jar:/template/css_xhtml/styles.css to /struts/css_xhtml/
5. Extract struts2-core-2.0.x.jar:/template/css_xhtml/validation.js to /struts/css_xhtml/
6. Extract struts2-core-2.0.x.jar:/template/ajax/dojoRequire.js to /struts/ajax/
7. Extract struts2-core-2.0.x.jar:/template/ajax/validation.js to /struts/ajax/

2. Download the source of Dojo 0.4.0

Download the source of Dojo 0.4.0 using subversion (an archive is not available). The source included with Struts 2 can't be used to create new profiles as it doesn't include the required build-scripts. Place the source anywhere outside your web resources. These instructions assume you use a directory called dojo-0.4.0

svn export http://svn.dojotoolkit.org/src/tags/release-0.4.0/ dojo-0.4.0

3. Copy the Struts 2 widgets into the Dojo directory

The custom Dojo profile will need to include the Struts 2 widgets. The simplest way to do this is to copy the Struts 2 widgets into the dojo directory so they can easily be referenced by the profile.

1. copy /struts/dojo/struts/* to dojo-0.4.0/struts

4. Create the custom profile for Dojo

The Dojo custom profile is configured through a file in the dojo-0.4.0/buildscripts/profiles directory. This directory already includes many example profiles. The struts2.profile.js file provided below includes almost all Dojo functions and widgets within dojo.js. This is good starting point for optimization.

var dependencies = [
   "dojo.lang.*",
   "dojo.html.*",
   "dojo.debug",
   "dojo.html.display",
   "dojo.html.layout",
   "dojo.html.util",
   "dojo.lfx.*",
   "dojo.event.*",
   "dojo.logging.*",
   "dojo.io.*",
   "dojo.io.IframeIO",
   "dojo.date",
   "dojo.string.*",
   "dojo.regex",
   "dojo.rpc.*",
   "dojo.xml.*",
   // "dojo.flash.*",
   // "dojo.storage.*",
   "dojo.undo.*",
   "dojo.crypto.*",
   //"dojo.collections.*",
   "dojo.collections.ArrayList",
   "dojo.collections.Collections",
   "dojo.collections.Queue",
   "dojo.collections.Stack",
   "dojo.dnd.*",
   "dojo.widget.*",
   "dojo.widget.TabContainer",
   "dojo.widget.PageContainer",
   "dojo.widget.LinkPane",
   //"dojo.widget.Editor2",
   //"dojo.widget.RichText",
   //"dojo.widget.Editor2Toolbar",
   //"dojo.widget.ColorPalette",
   "dojo.math.*",
   //"dojo.reflect.*",
   "dojo.uri.*",      
   "struts.widget.Bind",
   "struts.widget.Bind",
   "struts.widget.BindDiv",
   "struts.widget.BindAnchor",
   "struts.widget.ComboBox",
   "struts.widget.StrutsTimePicker",
   "struts.widget.StrutsTimePicker"
];

dependencies.prefixes = [
   ["struts", "struts"]
];

load("getDependencyList.js");

• Note: the "struts", "struts" notation above states that code in the struts.* namespace is located in the struts/ directory. This is where the struts widgets were copied to at Step 3.

5. Build Dojo using the custom profile

Build a new Dojo release using ant.

cd buildscripts
ant -Dprofile=struts2 -Dstrip_and_compress=true clean release intern-strings 

Notes:

• struts2 is a reference to the new profile file created in buildscripts/profiles (struts2.profile.js)
• The other options compress the javascript and copy all referenced text resources (such as html templates) into dojo.js as well

Pay some attention to the build process. Many resources are included that aren't likely to be required that may be helpful later for optimizations. Some errors will occur while stripping the comments but these are ok.

6. Copy the Dojo release into /struts/dojo

When the build process completes the release directory will contain the new Dojo build. Copy the content of the release directory over the top of /struts/dojo. You'll notice it's almost exactly the same as the original.

It's okay to delete the apis, demos, documents test and release subfolders. The src subfolder must be distributed with your application as it contains images used by dojo. The nls subfolder is used by the datetimepicker.

Your /struts directory should now look like this:

 struts/
   - ajax/
   - css_xhtml/
   - dojo/
       - nls/
       - src/
           - animation/
           - ...
           - xml/
       - struts/
           - widget/
           - widgets/
   - niftycorners/
   - simple/
   - xhtml/

7. Clear your browser cache and test your application.

That's it. When testing the application, note the larger dojo.js file being loaded and significantly fewer requests for resources by Dojo Hopefully it's also a lot faster now.

You can go back and optimize the profile by removing resources you don't need. There's examples in the profiles directory. Repeat the build/test process to find the right balance between the filesize of dojo.js and resources loaded separately.