Speed up XUL GUI Development on Linux

1.) Install eclipse ganymede: http://www.eclipse.org/downloads/ (Works fastest with SUN’s JDK)


$cd download/path
$tar eclipse-jee-europa-linux-gtk.tar.gz
$vi /usr/local/bin/eclipse

Paste the following text inside to start Eclipse with optimized memory settings: download/path/eclipse/eclipse -clean -configuration download/path/eclipse -vm /path/to/jdk/jdk1.6.0_02/jre/bin/java -vmargs -XX:MaxPermSize=350m -Xms128m -Xmx350m

XX:MaxPermSize and Xmx can be adjusted upwards depending on the amount of memory available on your system. Making -Xms too high seems to make eclipse grow the heap size too high too fast.

2.) Install Eclipse xulbooster plugin; please follow instructions on the link below:

http://cms.xulbooster.org/index.php?option=com_content&task=view&id=14&Itemid=2

You should now have colour coded editors for .xul, .rdf, .js, .dtd and .properties files.

Previews on localized xul documents will not work by default. To enable localized xul document previews using xulbooster, use the trick below:

$cd /etc/gre.d

Open the conf file with the highest version as this is most likely the xulrunner instance the xulbooster plugin is most probably using:

$vi 1.9.0.3.system.conf

4.) Navigate to the location of the xulrunner libs (GRE_PATH) indicated in the gre conf file:


$cd /usr/lib/xulrunner-1.9.0.3
$cd chrome

Find out the exact path of the .dtd files the xul document you want to preview on Eclipse is using for localization. Create a symbolic link to this path inside the chrome folder:


$ln -s /path/to/my/chrome/locale myextension

‘myextension’ can be any name. In our example, myextension will contain the chrome folder within it. The chrome folder will in turn contain the content and locale folders.

5.) Depending on the locale your firefox browser is using, open the corresponding .manifest file. In our case, since we’re using the en-US locale, we open the en-US.manifest file:

$vi en-US.manifest

Append the following line (depending on the name of your symbolink link above and the folder structure within your extension):


locale myextension en-US my_extension/locale/en-US/

The .dtd files (myextension locale files) are now available to the xul instance and by extension the xulbooster plugin. It should now be possible to preview localized xul documents without having to restart firefox. This should hopefully significantly improve one’s speed of xul GUI interface development.

6.) Automatically update your extension by running a script:

$vi /usr/local/sbin/myextension-update

Contents of the script:


#!/bin/sh
cp /path/to/my/extension /home/myhomedirectory/.mozilla/firefox/tame3m4a.default/extensions/{myextension-uuid}/

Now updating your firefox extension with the changes you have made should be as simple as running:

$myextension-update

7.) Install Quick-Restart Firefox extension: https://addons.mozilla.org/en-US/firefox/addon/3559

Now restarting firefox to view the changes you have made to the extension you are developing should be as simple as pressing the Ctrl+Alt+R keys.

XUL Development on Linux is not too well documented on the web yet and any more tips we could add for Linux developers would be highly welcome.

Leave a comment