Web template hook styles

This article is a supplement to the Delimiting and embedding strategies.

On web templates the separation of concerns (content from presentation) require a low-level separation strategy to isolate template language from output language.

File:Template hooks.gif

The use of hooks are exemplified by the red marks. It permits the separation between logic (hidden for blue designers-view) and design.
Below the source code example, where black and green are two distinct languages.

Template syntax need special care with the "border" between languages, to avoid mixing and to supply scaping forms. There are well defined tags, marks or characteres, named "hooks", that intend to separate (compatibilize) the two languages.

Types of hook:

• Script hooks: encloses blocks of developer-supplied program logic.
• Sub-template hooks: to fix the frontiers of the sub-template block.
• Expression hooks: to encode scalar variables, sub-template references, or expressions.

Note: formally, all template language need clear rules for "clean-up (or extract) the template language" from the output language. Hooks, scripts and expressions are extracted with the Clear(T) function.

There are a height diversity of implemented styles for hook encoding, and there are also web template systems with options to reconfigure hooks.

The listings below show the hooks styles used on the web template system's examples.

Hook implemented notations

There are many styles of notations implemented (or configurable) on web template systems. To referentiate then on other articles, "style labels" was supplied.

Script hooks

Usual script hooks:, for instructions block.

Style label	Hook encode	Template systems
ASP	<% script %>	Default for ASP and JSP, optional for many others.
Cocoon	<xsp:logic> script </xsp:logic>	Apache Cocoon.
ColdFusion	<cfscript> script </cfscript>	ColdFusion.
PHP	<? script ?>	Default for PHP, optional for many others.
XQuery	{ script }	Part of the XQuery syntax, where script is a single expression.
XML PI	<?PItarget script ?>	For generic Processing Instructions (PI), given a target-application. Example, on PHP <?php ... ?> is an optional hook. See XML 1.0 Recommendation.

Many template languages not offer syntax to separate blocks, or offer a syntax option to express isolate instructions.
Single-instruction hooks:

Style label	Hook encode	Template systems
ColdFusion	<cfInstruTag .. parameters .. >	ColdFusion.
C preprocessor	#instruction script line	CheetahTemplate, C preprocessor, and others.
SSI	<!--#instruction -->	SSI.
XSLT	<ns:instruction parameters/>	XSLT (with the xsl namespace) and others.
Attribute language	<hostTag tal:instruction="..."> ... </hostTag>	Zope (TAL).

Many offer the possibility of define sub-templates (or other instructions) into the instruction body
Instruction hooks with sub-templates:

Style label	Hook encode	Template systems
ColdFusion	<cfInstructionTag parameters > sub-template </cfInstructionTag>	ColdFusion.
CheetahTemplate	#instructionOpen line sub-template #instructionClose line	CheetahTemplate and others.
XSLT	<ns:instruction parameters> sub-template </ns:instruction>	XSLT (with the xsl namespace) and others. Usually the sub-template is not-referenciable, like on xsl:for-each or xsl:if instructions.
Attribute language	<hostTag tal:instruction="..."> ...<subTag tal:subInstruction="..."/> ...</hostTag>	Zope (TAL).

Sub-template hooks

See also Directive hooks with sub-templates, where, usually, the sub-templates are not-referenciable.

(referenciable) Sub-template hooks, to sub-template block definition:

Style label	Hook encode	Template systems
PHPlib	<!-- BEGIN blockName --> ... <!-- END blockName -->	PHPlib and many other similar variations.
XSLT	<xsl:template match="pattern" name="tName"> ... </xsl:template>	XSLT, referenciable by name (named template) or by pattern event.

Expression hooks

Generic expression hooks:

Style label	Hook encode	Template systems
ASP	<%=expr %>	Default for ASP and JSP, optional for many others.
Cocoon	<prefix:tagExpr>expr</prefix:tagExpr>	Cocoon in the form "<xsp:expr>expr</xsp:expr>"; JSP in the form "<jsp:expression>expr</jsp:expression>".
PHP	<?=expr ?>	Default on PHP, optional for many others.
XQuery	{expr}	Smarty, PHPlib, XQuery, and on XSLT attributes.
XSLT	<xsl:value-of select="expr" />	XSLT.

For more specific expression hooks, there are cases where a "hook notation" is used, and others where a "internal template language syntax" is used. When "internal", may be important important also for presentation users of the template language (see separation of concerns needs).

Specific function-call expression hooks examples:

Hook style	Hook encode	Commentaries
ASP	<%=foo(x) %>	Internal.
Custom-tag	<tagName x="$y"/>	Many, like JSP, use de XML style, with tagName in the form "prefix:name". ColdFusion use "cf" prefix. Note: custon tags may also use local sub-template as parameter (body content).
PHP	<?=foo($x) ?>	Internal.
Piped	{$x|foo|nl2br}	On Smarty the composite function nl2br(foo($x)) is expressed in a Unix filter style. This notation is important, from good separation point of view, to separe pure data ($x) and rendered data (piped function calls).
XQuery	{fn:foo($x)}	Internal. XQuery and XSLT-2.

Many template inlanguages offer also an internal syntax expression to interpolate strings. They use internal notation, like "string-hooks", for separation.
Examples for specific expressions with interpolations:

Hook style	Hook encode
Cocoon	<xsp:content>Nonono <xsp:expr>x</xsp:expr>, <xsp:expr>y</xsp:expr>nonono.</xsp:content>
ColdFusion	<cfoutput>Nonono #x#, #y# nonono.</cfoutput>
JSP	<jsp:text>Nonono $x, $y nonono.</jsp:text>
PHP	<?="Nonono $x, $y nonono." ?>

Hook diversity

Basic factors:

1. It is very ease to implement template engines to simple substitution template languages. If the application grow, and need more sophisticated language, it will be compatible with the first versions.
2. The web template final user is, usually, a web designer. He/she deals with the templates through a web editor, like Dreamweaver. There are many editors and web designer needs may force template language to adapt to the editor's restrictions.

XML hook uniformazation tendency

File:Template hooks xNs.gif

The XML notation uniformize the hooks. The same example (see figure above) was adapted for XML syntax.

There are a tendency on template languages to compatibilize hooks with the XML syntax rules. On XML it is possible to embed many languages together. A language namespace for tag names, are defined by prefix.

JSP example, for "specific hook notation" Versus "XML notation" (from the J2EE 1.4 tutorial):

Syntax Element	Specific notation	XML notation
Declaration	<%! ..%>	<jsp:declaration> .. </jsp:declaration>
Directive example	<%@ include .. %>	<jsp:directive.include .. />
Expression	<%= ..%>	<jsp:expression> .. </jsp:expression>
Script	<% ..%>	<jsp:scriptlet> .. </jsp:scriptlet>

Another way to embed template language on XML languages, is to add special/reserved attributes. See Attribute languages.