Facelets

Features

• New replacement for JSP with UI components and XML formatting.
• Facelets can be used seamlessly with JSF.
• No compile time overhead like JSP; faster.
• Easy for UI designers as they can use existing XML/HTML development tools.
• Easy to build custom components and templates using composite views.

Note: JSP is compiled in to a servlet, Facelets  use a fast SAX parser to build the page.

 

Getting Started

• Download Facelets zip file and copy jsf-facelets.jar into WEB-INF/lib.
• Modify faces-config.xml and set com.sun.facelets.FaceletViewHandler as the view handler. (This will override the default view handler setting which is expecting JSP file formats)

    <application>
        <view-handler>
        com.sun.facelets.FaceletViewHandler
        </view-handler>
    </application>

• Modify web.xml file to give defaul suffix.

    <context-param>
        <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
        <param-value>.xhtml</param-value>
    </context-param>

Our JSF pages should have the file extension ‘.xhtml’ and you can have a servelet mapping '*.jsf' files for the  faces servlet. In that way, the actual page 'mypage.xhtml' can be accessed as 'mypage.jsf'.

 

How to Use

Templating

One of the main advantages of Facelets is its use as a templating tool for JSF pages. You simply creates a basic layout page, divide it into logical areas as you wish (with ui:insert tags) and implements the basic contents in those logical areas. Then, for any page in your application that you want to use the template just have to put ui:composition tag in the page and override any implementation of the logical areas with ui:define tag. This is a very simple and elegant way of doing page templating; something I was looking for quite a sometime. Let's see this example;

This is my template: layout.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:c="http://java.sun.com/jstl/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">
<!--
Author      : Lasantha Kularatne
Date        : Jan 27, 2009
Version     : 1.0
Copy Rights :  Lasantha Kularatne
-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
<ui:insert name="scriptslinks">
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<script type="text/javascript" src="../js/myjsfile.js"></script>
</ui:insert>
<title><ui:insert name="title">My Portal</ui:insert></title>
</head>
<body>
<!-- header -->
<ui:insert name="myheader"><ui:include src="header.xhtml"/></ui:insert>
<!-- data -->
<ui:insert name="mydata"></ui:insert>
<!-- footer -->
<ui:insert name="myfooter"><ui:include src="footer.xhtml"/></ui:insert>
</body>
</html>

I have divided my page into three logical areas called myheader, mydata and myfooter. I have basic implementations for header and footer in header.xhtml and footer.xhtml respectively, but not for the data area. Also I have two more logical areas for title and links/scripts.

Let's see how we can use this template: mypage.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:composition template="./layout.xhtml">
  <ui:define name="title"><h:outputText value="#{bundle.TESTPAGE_TITLE}" /></ui:define>
  <ui:define name="mydata">
    <h:form id="MyForm">

      ...

    </h:form>
  </ui:define>
</ui:composition>
</html>

As you can see here, I have overridden the title and data areas. I put the title reading from my resource bundle and I have used a JSF form element in m data area. <ui:composition> tag is used to compose the page and notice that template reference (layout.xhtml). You have to give the template file name with the relative path. 

 

Composite Components

It is very easy to build composite components with Facelets. All you have to do is use a ui:component tag and include you code. When ever you want to use that component, you simply have to include that file. Let's look this example: mycomponent.xhtml.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<ui:component>
    <div id="mylogo">
        <a href="http://www.mycompanypage.com">       
            <span>My Company Pvt Ltd.</span>           
        </a>
    </div>
</ui:component>
</html>

Notice that, although here we have some tags around ui:component tag, those will be discarded by the Facelets engine. Those tags are there only  to identify the page by editors.

 

Commonly Used Tag Libraries

• JSF Core Tag Library (xmlns:f="http://java.sun.com/jsf/core")
• JSF HTML Tag Library (xmlns:h="http://java.sun.com/jsf/html")
• Facelets UI Tag Library (xmlns:ui="http://java.sun.com/jsf/facelets")
• JSTL Standard Tag Library (xmlns:c="http://java.sun.com/jstl/core")
• JSTL Functions Tag Library (xmlns:fn=http://java.sun.com/jsp/jstl/functions)

 

Facelets UI Tag Library

For further information, read about these tags and get familiar how you can use them in your project.

• ui:component
• ui:composition
• ui:debug
• ui:decorate
• ui:define
• ui:fragment
• ui:include
• ui:insert
• ui:param
• ui:remove
• ui:repeat

 

References

1. Sun Java official Facelets page.
2. Facelets Documentation.
3. Facelets fits JSF like a glove.
4. FaceletsTools for Dreamweaver.

JavaScript Performance Testing with 'SunSpider'

I have done some web browser benchmarking with SunSpider benchmark test. I used the following browsers;

• Chrome 0.4
• Firefox 3.0.4
• Opera 9.61
• IE 6
• Safari 3.0.3
  

I found that Google Chrome outperformed all the browsers, and it was 30X faster than IE! There was something going wrong with Safari, it did not even finish the test; it stopped at 'controlflow-recursive' test and did not proceed.

Welcome Back!

Hello There... After a long time I am writing to my personal blog. First I want to apologize for a long delay. This year was a very busy and exciting one for me. Well the big news is I got married in last December and now I am living in Austin with my wife, Natasha. Married life is kind of busy :) and interesting; with some added responsibilities. I am planning to visit Sri Lanka soon and will be back in January 2009. I will post to my blog frequently when I come back. (NO, I mean it, there will not be more long gaps in my blog).

There are some interesting articles I would like to post about the new things I learnt and done in specially Java, Spring, Hibernate, Facelets, CSS, Unit Testing with DBUnit and H2 database etc. I got lot to share, so don't go away, stay tuned!

Interview with Linus Torvalds about the Linux Kernel

I was reading an interview with Linus Torvalds about the Linux Kernel and related topics. There were very interesting ideas he brought up. The most interesting answer ,as I saw, he gave was to the following question.

APC: Do you use a specific distribution of Linux at home or work?

LT: A "specific" one? No. I have changed distributions over the years, and it tends to really end up depending on various random circumstances, like just when I switch machines around and what happens to be convenient.

So right now I happen to run Fedora on my machines, which largely came about from me running on POWER for a few years, and Fedora supported it pretty well (and since I actually don't care that deeply about the distribution, I tend to prefer running the same thing on everything, just to keep any distro issues away).

Before Fedora had PowerPC support, I ran YDL for a while, and before that I had SuSE. Funnily enough, the only distributions I tend to refuse to touch are the "technical" ones, so I've never run Debian, because as far as I'm concerned, the whole and only point of a distribution is to make it easy to install (so that I can then get to the part I care about, namely the kernel), so Debian or one of the "compile everything by hand" ones simply weren't interesting to me.

Interesting ha?

You can read the whole interview here.


- Lasantha