Introduction to Javaserver Faces - What is JSF?

Written by Chris Schalk , Oracle Corporation
April, 2005

What is JSF?

JavaServer Faces (JSF) is a new standard Java framework for building Web applications. It simplifies development by providing a component-centric approach to developing Java Web user interfaces. JavaServer Faces also appeals to a diverse audience of Java/Web developers. "Corporate developers" and Web designers will find that JSF development can be as simple as dragging and dropping user interface (UI) components onto a page, while "systems developers" will find that the rich and robust JSF API offers them unsurpassed power and programming flexibility. JSF also ensures that applications are well designed with greater maintainability by integrating the well established Model-View-Controller (MVC) design pattern into it's architecture. Finally, since JSF is a Java standard developed through Java Community Process (JCP), development tools vendors are fully empowered to provide easy to use, visual, and productive develop environments for JavaServer Faces.

JSF Architecture

JavaServer Faces' Implementation of MVC

One of the key advantages of JSF is that it is both a Java Web user-interface standard as well as a framework that firmly follows the Model-View-Controller(MVC) design pattern. This makes JSF applications much more manageable because the user-interface code ( View) is cleanly separated from the application data and logic ( Model). To prepare the JSF context, which provides application data access to the pages, and to guard against unauthorized or improper access of the pages, all user interactions with the application are handled by a front-end "Faces" servlet ( Controller).


Figure 1: JavaServer Faces Implementation of MVC

The JSF Lifecycle

The Faces Controller servlet serves as the link between the user and the JSF application. It operates within the confines of a well defined JSF Lifecycle which dictates the entire flow of events between user requests. For example, upon an initial Web request to access a JSF application, the Faces controller servlet handles the request by first preparing the JSF context, which is a Java object that holds all application data. The controller then routes the user to the requested page. The page usually renders application data from the JSF context using a simple Expression Language. Upon subsequent requests, the controller updates any Model data, providing any new input has been entered. JSF developers have programmatic access to the entire JSF lifecycle at any time during its execution thus affording a high degree of control over the application's behavior at all times.

JavaServer Faces' User-Interface Components

The true power of JavaServer Faces lies in its user-interface component model where applications are merely built from collections of components that can render themselves in diverse ways for multiple client types. Vaguely similar to other proprietary technologies such ASP.Net, JSF's UI Component model technology offers unprecendented productivity by allowing the developer to construct Web user interfaces using pre-built user-interface (UI) Components as opposed to having to construct the user interface entirely from scratch. JSF UI Components come in many forms and can be as simple as an outputLabel which simply displays text or as complex as a dataTable which can represent a tabular data from collections of data such as from a database table.

The JavaServer Faces specification provides a set of base UI Components in its Reference Implementation which are very useful on their own. These include two libraries of components such as the "HTML" component library which largely mirrors the standard HTML input elements along with a "Core" library which aids in common application development tasks such as internationalization, and validating/converting input data. In addition to providing a base library of UI Components, the JSF API offers the ability to extend and create custom JSF UI Components providing additional functionality above and beyond the base components.

Additional User-Interface Component Libraries

Because of the richness and flexibility of the JSF API, many Java developers are beginning to create new JSF Component libraries and implementations. Oracle's ADF Faces is a fully compliant JSF component library which offers a broad set of enhanced UI Components for JSF application development. These include multiple renderers per client type, advanced tables, color and date pickers along with a host of general components such as menus, command buttons, shuttle choosers and progress meters.


Figure 2: Oracle's ADF Faces JSF UI Components

In addition to Oracle's ADF Faces there are other new JSF Component Libraries beginning to appear from both the Open Source and software vendor communities. MyFaces is an example of a new JSF UI Component Library being offered as an Open Source project through Apache. Myfaces also serves as an enhancement to the JSF base UI components in that they also have more extensive UI capabilities such as integrated Tiles support, Javascript enabled menus and Tree controls.


Figure 3: The Open Source MyFaces Implementation and UI Component Library

JSF UI Components' Pluggable Rendering Technology

One of the most compelling aspects of JSF's UI Component technology is it's pluggable rendering capability. JSF UI Components have the ability to render themselves differently depending on the client type viewing the component. For example a HTML browser will view an "HTML Browser Friendly" version of a particular UI Component whereas a Wireless or WAP enabled micro-device would view a "WML friendly" version of the same UI component! JSF makes this possible by de-coupling the UI Component from its rendering logic making it possible to create multiple renderers for the same UI Component. Different renders can be associated with the UI Component and at runtime the UI component can decide which renderer to use based on the requesting client type.


Figure 5: A Single ADF Faces Table Component Rendering Differently for Wireless and HTML Clients

It should also be pointed out that because of JSF's pluggable rendering capability it is possible for JSF UI Components to render any kind of data be it markup, such as HTML, XML, WML etc.., or binary data. For example UI Components can also render binary data such as an image streams or different document types such as SVG, PDF and Word.

A New Community of JSF Component Developers

As the community of JSF developers and enthusiasts continues to grow, there are now several Websites dedicated to further empowering independent JSF development.. JSFCentral is an example of a new Website solely dedicated to the JSF development community. It contains JSF technical information, product/component information as well as a vast listing of numerous JSF related articles.

(JSFCentral is located at: http://jsfcentral.com)

JSF Development Tools

Because JavaServer Faces is a standard Java technology, software development tools are fully empowered to offer advanced integrated development tools support for JavaServer Faces. This greatly enhances JSF's ease of use and power in that multiple vendors are now supporting JSF development to varying degrees. Oracle, Sun , Borland and IBM each offer development environments for JavaServer Faces. Since development tools vendors are competing at providing better, easier and more development environments, the future of IDE based JSF development looks great!


Figure 6: Oracle's JDeveloper Offers a Productive, Visual JSF Development Experience

Summary

JavaServer Faces solves many of the historical problems of Java Web development by providing a clean implementation of the Model-View-Controller design pattern while providing a productive, component-centric development without sacrificing development power and flexibility. Additionally since JSF is a Java standard, multiple software vendors will continue to provide evermore productive and efficient development environments which will no doubt rival and most probably surpass proprietary visual development environments. Stay tuned!