In this article, I will show you how to use SiteMesh in your JEE web sites in order to bring a sense of unity to them.
When talking about templating, the method everyone uses at first is to use <@include> tags throughout the JSP pages.
This course of action is flawed from the start since all JSPs are responsible to call includes and thus, there’s no real enforcement to use the correct ones.
The most used method is Apache Tiles. To be frank, I didn’t have a look at Tiles since it went from Struts to Apache. Struts Tiles were meant to be used in conjunction with Struts. Apache Tiles seems to support many more technologies (JSP, Velocity, Freemarker, …) but I didn’t see any JSF support out-of-the-box though there seem to exist plenty of articles that tackle the subject and its problems.
When I used Struts Tiles, I found it was a very powerful framework, yet many junior developers had some problems with it. In most projects I worked on, a senior developer assembled tiles while junior ones created the pages themselves. I found Tiles very configurable but this came at the cost of complexity. In most cases, I didn’t need all the functionalities of Tiles: I only wanted to have a header, a footer and a menu nicely crafted around my main page.
When investigating AppFuse, I stumbled upon a nice templating tool that just does that: SiteMesh. SiteMesh is technology-neutral, meaning it can be used with whatever view framework is used, JSF included. It is based on the very simple concept of servlet filters. An XML file forms the basis of the template’s configuration. This configuration holds what pages are decorated and with what templates.
The templating mechanism is made so each page is seen as complete either when viewed standalone or when viewed through the filter. For example, when you write the page normally, you provide the title’s text (what is displayed in most browser’s title bar). If you are using SiteMesh, nothing changes. At runtime, the servlet filter reads the title’s text value from the source HTML (which can come from a dynamic source) and outputs the decorated page with the same title’s text value, although the page design will be different.
The following example shows how it is achieved in the template:
<html>
<head>...</head>
<body>
<div id="top">Header</div>
<h1><decorator:getProperty property="title" /></h1>
...
</body>
<html>Nothing could be simpler. Yet, the solution decouples the standalone view from the decorated view. The former has no need to know about the latter!
A common use-case is to put common CSS and JavaScript declarations in the template.
Moreover, the choice of which decorator(s) to use can come from different strategies:
- configuration files,
- cookies,
- browser language,
- display agent (browser or printer),
- etc.
The simplicity and the robustness of the solution is what will make me deeply think about using it if I have simple templating needs. On the opposite site, if you have complex templating requirements, SiteMesh won’t be enough.
You will find a very simple project here in Maven/Eclipse format.