XUL or extjs....

Having just completed one project with extjs, (otherwise known as yui-ext). I thought I would share my thoughts on it.

As a side project, if you liked FlexySvn, my little XUL based Subversion browser, I started playing with a Javascript only version (A single HTML page - no Server / PHP support required):
http://www.akbkhome.com/FlexySvn/templates/test1.html (Firefox only seems to work at present - although I would guess IE fixes should not be to difficult).

This uses XmlHttpRequest's to do roughly the same things that 'svn ls/log/cat' etc. do. - (Done by snooping the packets with Wireshark.). Using Extjs for the interface, and dp.SyntaxHighlighter to do all the syntax highlighting.

This little test does illustrate the key differences between XUL and the Extjs approach.

Ext js advantages/disadvantages

• In-page popups are faster than desktop popups - leading to a snappier interface. (not seen in my svn browser, but a serious issue for other applications)
  
• Interface 'can' work on other browsers, although doing anything complex tends to end up with considerable time taken dealing with IE or Safari bugs.
• Load times are problematic (even stripped down libraries can be a high load if you are offering just a simple form with validation).
• Difficult to see how to have a page degrade nicely for non-js browser - eg. mobile devices.
• extjs bugs tend to be browser specific bugs, and often with things like Safari, which can be exteremly time consuming to fix.
• Defining CSS styles for OL/UL/BODY etc. in the standard css file makes it a bit of a nightmare to work with existing HTML designs.
  

XUL development advantages/disadvantages.

• Single platform make debugging and testing considerably simpler (if it runs in Firefox, it will run everywhere.)
• Interface as XML has a more natural feel to it -  considerably simpler to spot and fix a  layout issue, rather than decyphering a large number of javascript statements.
  
• The approach we used where XUL is served up by PHP, and using frames/pages to react to different sections of the application, make inter-section communication more complex. Compared to a pretty much 'one-page' approach with extjs, which makes managing state considerably simpler.
• Difficult to mix HTML and XUL, using namespaces is klunky, normally we need to use <HTML:everything in here is HTML!>....</HTML> rather than having to ensure we are using XHTML and the namespace.
• bugs tend to be either browser related or security related. - modal dialogs comes to mind...

I have to say that Firebug has been a life saver for the projects I've been doing these last few weeks, and has overtaken the webdeveloper extension at the top of the list of essential extensions.

At the end of the day, When we start a new project that needs an administration system, (non-public), Neither of them offer a perfect solution yet. But I think XUL comes out marginally ahead, given the reduced time spend debugging non-mozilla browsers. (Although the modal windows and popup load times is a serious problem)

For a public front end, I think after some consideration, I will still recommend extjs except where support is needed for mobile devices. And Just hope that I dont get too caught out by IE and Safari's bugs.