Creating a Custom Dojo Build with Dojo 0.4.2

and other things: Creating a Custom Dojo Build with Dojo 0.4.2: "Creating a Custom Dojo Build with Dojo 0.4.24
Note: I noticed a lot of people arrive to this post from google. This post is about Dojo .4.2. If you are using 1.0 or above the system has changed entirely and you will be happier with the information from dojotoolkit.org. I recomment to check google for 'site:dojotoolkit.org custom build' for 1.0 and above. Otherwise continue reading!

The Dojo toolkit has some really great stuff. I am convinced that by te time they reach 1.0 it will be one of the best javascript toolkits around, and the fact that it is open source and not propietery is very attractive.

However, it can tak a long time for the browser to load all of the files needed to use the fancy widgets and so which are normally loaded after the page loads to preserve flexibility. To solve this, the dojo developers have made a way to create a custom dojo build, which lets you put everything in on js file that the browser can cache.

Here is a link to the section in the Dojo Book
http://www.dojotoolkit.org/node/185

Since I still develop on Windows, I had to start with installing Apache Ant from http://ant.apache.org/6 on Windows, and came accross these simple instructions:

http://dita-ot.sourceforge.net/doc/installguide/installingant.html7

I decided as instructed to put ant in c:\ant and added c:\ant\bin to my PATH and added ANT_HOME set to c:\ant in my environmental variables.

Why not have an ant comiling a dojo? I get a vision of a bunch of ants in white aikido outfits meditating and ready to enter the dojo for combat, but that's probably just me.

Anyway, back at cmd let's try a few things.

c:\>ant -help
Prints out a help message, wild. Looks like it's basically there.

Now let's get a copy using subversion of dojo 4.2 and put it in the c:\dojo folder.
For this you will need tortoise subversion: http://tortoisesvn.tigris.org/
8
c:\>mkdir dojo
c:\>cd dojo
c:\dojo\>svn co http://svn.dojotoolkit.org/dojo/tags/release-0.4.2

After a few minutes of downloading that should give you a few meg of files in
c:\dojo\release-0.4.2\

Now let's try making a profile, mine ended up being this:

var dependencies = [
'dojo.io.*',
'dojo.io.BrowserIO',
'dojo.event.*',
'dojo.xml.*',
'dojo.widgets.*',
'dojo.widgets.Button',
'dojo.widget.LayoutContainer',
'dojo.widget.FloatingPane',
'dojo.widget.ResizeHandle',
'dojo.io.IframeIO',
'dojo.widget.Dialog',
'dojo.dnd.HtmlDragMove',
'dojo.widget.Slider'
];

load('getDependencyList.js');


And save that profile as c:\dojo\cms.profile.js

Now let's ant it up....
c:\dojo\release-0.4.2\buildscripts\>ant -DprofileFile=c:\dojo\cms.profile.js clean release intern-strings strip-resource-comments

No dice, I get this error:
Unable to locate tools.jar. Expected to find it in C:\Archivos de programa\Java\
jre1.5.0_11\lib\tools.jar
Buildfile: build.xml does not exist!
Build failed

After a bit of reading it looks like I need the full J2SE, not just the Runtime Edition (J2RE), so off to download one more thing to get this dojo ant java voodoo to go.

So I got the J2SE SDK from http://java.sun.com/j2se/1.4.2/download.html
And I needed to set JAVA_HOME to c:\j2sdk1.4.2_14 to get Ant to find tools.jar.

After that whoooopie!!

Ant created a new directory c:\dojo\release-0.4.2\release\dojo with my nice compressed release, and I copied that dojo folder into my app.

** IMPORTANT
You have to copy the entire release folder, since just copying dojo.js does not make all of the template paths work, especially for widgets.

The Results:
From 145 requests down to 115 requests on a refresh. And much quicker loading.

The dojo.js file went from about 140kb to over 300kb though, so we really need to gzip it. For this I would recommend mod_deflate or using another gzip solution.

As noted before though, the best part is that the browser can now cache all of the dojo widgets and templates so that the editing process is much faster for the end user."