Creating rich web pages using richfaces

                                              Boby Thomas - 24 - 07 -2009

After crating pages in JSP for some months, I wanted to move to one of the latest framework which can make creation of rich GUI simple. My search ended in Rich faces. Most of the features what I wanted in a web development framework was available in rich faces. If you are a Java programmer looking to develop rich web application, this is one framework you should definitely consider.

When I started creating dynamic content web pages using java using jsp, I had the following pain areas.

• I was not interested in writing java scripts but forced to for some desired features.
• It was a pain spending time on beautification of pages.
• I never liked working on css.

In rich faces, I could find a solution for all these and more. Following are the main features which were inbuilt in rich faces.

• Inbuilt AJAX support.
• I could create rich beautiful pages without writing single line of Java script.
• Features like beautification and themes were no more an issue.
• I didn't create even a single css file, yet creating beautiful user interfaces.

Inbuilt features

I found that few of the features are really simple to implement using rich faces.

1. Availability of wide range of widgets.
2. Ajax support.
3. Scrolling data tables for small list of data.
4. Themes.

When I started analyzing rich faces, two important points seemed to take more time than usual.

Pagination for huge data tables

Richfaces comes with scrollable datatable. We can use it out of the box if the data list is small. We need to fetch the complete data list in one shot and give it to the scrollabale data table. Now the widget will internally take care of pagination, scrolling, ajax request handling etc. But practically in most cases, the data list we would like to display will be huge. List might contain many thousands to many lakhs in the list. So in that case, it is not practically possible to supply the list to the widget in one shot. If we do that we will soon land up in "java heap exceptions".

This is a standard problem and as expected there was a solution provided to it. Only thing is we need to implement our own data model class. We need to implement our own implementation to handle all the data fetching from database based on the page, pagination, keeping track of data list etc.

To see a sample webpage - visit

Page templates and reusable layouts

Another issue for me was to create pages with reusable layouts. I wanted the split the pages to clear regions like header, footer, content area, navigation etc. I could find a solution for this by adding facelets to rich faces.

We can clearly define the page layout using facelets and change only the required spaces when we move from one page to another. This gave me a great flexibility to manage many pages with similar look and feel.

To see a sample webpage - visit

Advantages of using richfaces

1. Ajax support without writing single line of java script.
2. Browser supports - I always had the issue of pages showing weird behavior in some browsers. What looks good in Mozilla doesn't look good in explorer and other way. Though this is not completely avoided, richfaces definitely reduce your effort fine tuning the pages for different browsers.
3. Templating with facelets.
4. Vast collection of nice widgets.
5. We can use most of the features out of the box and others with very less work.
6. Works in sync with most of the other standard frameworks like hibernate, spring, seam etc.
7. Overall, fast development of pages focusing mostly on the functionality.

Next articles in pipeline

Pagination using richfaces with examples.

Templating webpages using facelets with examples.