This instructions specify how to create a new profile for Dojo as a performance optimization for Struts 2.0.x
Applies to Struts 2.0.x only. Superseded in Struts 2.1.x.
Customizing Dojo 0.4.0
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
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
- Edit struts.properties and set struts.serve.static=false
Copy the static resources out of the jar
- In your web resources directory, create a directory called struts (ie. this will have the URL /struts)
- Extract the files in struts2-core-2.0.x.jar:/org/apache/struts2/static/ to /struts
Copy the template resources out of the jar
- Extract struts2-core-2.0.x.jar:/template/simple/dojoRequire.js to /struts/simple/
- Extract struts2-core-2.0.x.jar:/template/xhtml/styles.css to /struts/xhtml/
- Extract struts2-core-2.0.x.jar:/template/xhtml/validation.js to /struts/xhtml/
- Extract struts2-core-2.0.x.jar:/template/css_xhtml/styles.css to /struts/css_xhtml/
- Extract struts2-core-2.0.x.jar:/template/css_xhtml/validation.js to /struts/css_xhtml/
- Extract struts2-core-2.0.x.jar:/template/ajax/dojoRequire.js to /struts/ajax/
- Extract struts2-core-2.0.x.jar:/template/ajax/validation.js to /struts/ajax/
Before continuing, check that your application still functions correctly. Confirm that resources from the /struts URL are being served from your directory.
If you don't use Editor2 (the HTML Editor), edit /struts/ajax/dojoRequire.js and remove the inclusion of Editor2. When enabled, this widget uses a lot of resources even if you don't include it on your page.
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
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.
- 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.
- 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.
- struts2 is a reference to the new profile file created in buildscripts/profiles (struts2.profile.js)
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:
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.
Note that almost all browsers will cache dojo.js if allowed to, but few (if any) will cache resources loaded by Dojo.