<title>XPFE vs. DHTML</title>
<font size="+1"><b>XPFE vs. DHTML</b></font>
<p>'In the beginning, there were 3 front ends: Mac, Windows and Unix. Each took a suite of developers to maintain. Adding a new feature (even just a
button) required 3 engineers to waste at least a day (more often a week) slaving away until the feature was complete. This had to change.'
<p>This <a href="http://mozilla.org/xpfe/ElevatorTouchyFeely.html">quote</a> is posted on mozilla.org and describes how the Netscape 4.x browsers
required a different set of engineers to create and maintain the code for the user interface, even though the browser looked nearly identical on each
different supported platform.
<p>For a company committed to creating an application that runs on a wide range of different systems, using platform specific code was a big waste of
time. XPFE, Mozilla's cross-platform front end, was designed to solve this problem by enabling engineers to create one interface that would then work on
any operating system.
<p>This new technology started out as a time-saving technique and turned into one of Mozilla's most powerful innovations. Mike Cornall, in <a
href="http://linuxtoday.com/news_story.php3?ltsn=2000-07-25-001-07-OP-SM-0036">an article</a> published on LinuxToday, summarizes the history of XPFE
well when he says: 'The application platform capabilities of Mozilla came about through a happy coincidence of Open Source development, good design, and
far-sighted developers who were paying attention.'
<p>Mozilla engineers were trying to create a more efficient process that would save them time and effort, but this technology ended up having the
unintended consequence of lowering the barriers to entry to application development. To better understand this happy coincidence and why it can be so
useful for developers it is necessary to take a closer look at what XPFE is made of.
<p>The technologies that XPFE uses are all existing Web standards, such as <a href="http://www.w3.org/Style/CSS/">Cascading Style Sheets</a>,
language called XUL, the XML-based User Interface Language). In it's most simple form, XPFE can be thought of as simply the union of each of these
<font size="-1"><i>Figure 1: XPFE Framework</i></font>
Mozilla-based application, Cascading Style Sheets are used for formatting the look and feel, and XUL is used for creating the application's structure.
Viewed together these three standards can be seen forming XPFE in Figure 1 above.
<p>Instead of using platform-specific C code to create an application, XPFE uses these well understood Web standards that are by design inherently
platform independent. Since the framework of XPFE is inherently platform independent, so are the applications that are created with it. Since the
framework is also made up of tools that are used to create Web pages, anyone familiar with creating a Web page can use XPFE to create a cross-platform
<p>Although the actual creation of Mozilla-based applications can be much more complicated than building a Web page, XPFE allows developers to create
applications in the same way they would create a Web page. Or to put it another way, the application is now a Web page. Gecko, the rendering engine
that Mozilla uses to draw a Web page in the browser, even draws the Mozilla application on the desktop.
<p>/*** extra content
<p>Mozilla itself certainly doesn't distinguish between a Web page and an XPFE application.
<p>Since well understood Web standards are being used to create applications instead of platform-specific C code, a whole new group of people now have the
ability to create their own applications using Mozilla.
<p>Web developers and designers who use Mozilla are naturally attracted to the fact that they can create applications using the same skills and
techniques that they used to create Web pages in the past. The specifics involved with creating Mozilla applications are different but should seem very
familiar to anyone who has created for the Web before.
<p>When talking about front ends it is important to clarify what this means. In this context a front end is more than the look and feel of a
Mozilla-based application, but includes the functionality and structure of that application as well. More simply put, XPFE allows users to do more than
just create a skin for an application. For example, Netscape 6 does use this functionality to allow for the creation of <a
href="http://www.netscape.com/themes/">different themes</a> for their browser suite, but the browser suite itself is also created out of these same
<p><b>Comparing XPFE and DHTML</b>
and CSS that allows a developer to create a Web application that is contained within the content area of a browser. XPFE provides a logical evolution to
this idea by allowing the creation of applications that are more powerful, more flexible and that can live outside of the browser window as stand-alone
and layout, and both use a fairly simple mark-up language to describe content. The difference between the two is that one of these mark-up languages is
HTML and the other is XUL.
<font size="-1"><i>Figure 2: Comparison of DHTML and XPFE</i></font>
<p>Although HTML has been put to many different uses, it was <a href="http://www.w3.org/MarkUp/#historical">originally designed</a> as a simple system to
link together separate text documents on the Internet. Later additions to the HTML standard have extended its functionality, but even these enhancements
can't make it an appropriate language to use for developing applications. XUL is a language specifically designed for creating user interfaces, so it
makes sense that XPFE is more suited for application development than DHTML.
<p>Fortunately since XUL as a language is structurally similar to HTML it is simple enough to learn if you are already familiar with the basic language
of the Web. Even if you have never used HTML before, XUL uses a straight-forward <a href="http://www.mozilla.org/xpfe/xulref/">collection of tags</a>
that makes it easy to get comfortable with it in a short time. Once you become accustomed to using XUL you will be ready to start using XPFE to create
your own applications.
<p><b>Oversimplifying in the Metaphor</b>
<p>This overview of XPFE as a simple evolution of DHTML is an oversimplification of the story and deliberately leaves out much important information.
These details were ignored at first to give a conceptual framework for understanding the new ideas that XPFE represent. Now that we've gotten past the
basics, we can go back and talk about the rest of the functionality available with using Mozilla to create applications.
<p>At the <a href="http://meetzilla.mozdev.org/second_meeting.html">Second Mozilla Developer Meeting</a>, Rob Ginda, the creator of ChatZilla, lead a
discussion group about Mozilla as Platform. In this session he listed all of the following as components of a Mozilla-based application:
<LI>XUL (XML-based User Interface Language) - Used to create the structure and content of an application.<br><br>
<LI>CSS (Cascading Style Sheets) - Used to create the look and feel of an application.<br><br>
<LI>XPInstall (Cross-Platform Install) - Used to package applications so that they can be installed on any platform.<br><br>
<LI>RDF (Resource Description Framework) - Used to store data and transmit information. Generally regarded to be one of the most complicated aspects of XPFE.<br><br>
<LI>DTD (Document Type Definition) - Used for localization and internationalization, more commonly referred to in short-hand as L12N and I18N respectively.<br><br>
<LI>XUL templates - Used to create a framework for importing data into an application with a combination of RDF and XUL.<br><br>
<p>Each of these technologies is important and several of these deserve to have whole books devoted to them. Although each of these technologies is
important there is a distinction to be made among them. Some of these are essential to the creation of a Mozilla application and some of them provide
powerful extra features that can be used in addition to the basic functionality.
<p>For example, <a href="http://www.mozilla.org/rdf/doc/">RDF</a> is an extremely powerful technology for using data in Mozilla but it is possible to
create an application without using it. <a href="http://www.mozilla.org/projects/l10n/mlp.html">Localization</a> also provides Mozilla with a great
amount of flexibility and usability but there are many existing applications that don't take advantage of this feature. It wouldn't be possible to
create an application without XUL though.
<p><b>Judge For Yourself</b>
<p>XPFE is a new technology that has yet to prove itself to the Web community and many people are skeptical about the need for an application framework
such as this. Before you make up your mind about XPFE, you should take a look at the many different applications that have already been created using
Mozilla so you can judge for yourself.
<p>If you are interested in trying out some of these, there are currently over 40 different Mozilla-based applications being hosted on <a
href="http://www.mozdev.org/projects.html">mozdev.org</a> that have been created using XPFE. Other applications using the same technology include
ActiveState's <a href="http://www.activestate.com/ASPN/Downloads/Komodo/More">Komodo</a> IDE, Rob Ginda's <a
href="http://www.hacksrus.com/~ginda/chatzilla/">ChatZilla</a> IRC client, and Zope's <a href="http://www.zope.org/Resources/Mozilla/">Mozilla
<p><i>Thanks to Julia Kleyman for creating the illustrations used in this article.</i>