Difference between ui:composition and ui:decorate

Question

What are the differences between ui:composition and ui:decorate in Facelets ? Both seem to support ui:define as child tags . In what cases would you use each of these ?

Answer 1

Anything outside <ui:composition> tag is disregarded. This isn't true for <ui:decorate>, which is thus beneficial as "template-in-template".

How that makes sense can maybe be better understood by looking at some real world examples in the below answers:

• What is the real conceptual difference between ui:decorate and ui:include?
• Is it possible to use template with composite component in JSF 2?
• Is there a way to run a JSF page without building the whole project?

Answer 2

As the documentation says: http://docs.oracle.com/cd/E17802_01/j2ee/javaee/javaserverfaces/2.0/docs/pdldocs/facelets/ui/decorate.html the decorator tags is identical to the composition, the only difference it's that ui:decorate don't disregard al the content outside of the tag, which can be useful when you want to make a template of an area or section of the page.

For example, ui:composition is useful when you want to make a template of the general look of your application. As it removes the content outside of the tag, the template attribute really defines the general look of areas of your application.

With the decorate tags, as the content outside the tag is not removed, you can make templates of the section that goes inside a content area.

An example could be an use of use composition templates to define header, menu, footer and content sections.

Then inside the content sections you can make use of the decorator tag when you want to make a form, and then make all your forms have the same look (with a title, components area, and buttons area for example).