In preparation for my upcoming talk on jQuery Templates, I've been been deep diving into the <a href="http://github.com/nje/jquery-tmpl">jQuery Template plugin created by Microsoft.</a>. Many of you are probably familiar with server-side template engines like Smarty or Cheetah but only recently have client-side template engines taken off. Considering how complex our web apps are becoming, it makes total sense.

The cool thing about templates is that it lets you easily structure your content display without all the hassle of string concatenation. For example, say I had a data set containing an ID and a name and I wanted to display the name as a hyperlink.

I could do something like this:

[code language="js"]
var clRec = &quot;&quot;;

for(var i=0; i&lt;client.name.length; i++) {
    clRec += &quot;&lt;li&gt;&lt;a href='clients/&quot;+client.id[i]+&quot;'&gt;&quot; + client.name[i] + &quot;&lt;/a&gt;&lt;/li&gt;&quot;;
}
[/code]

but to me, this seems much more readable and maintainable:

[code language="js"]
&lt;li&gt;&lt;a href=&quot;clients/${id}&quot;&gt;${name + &quot; &quot; + age}&lt;/a&gt;&lt;/li&gt;
[/code]