Client-Side Templating in jQuery at South by Southwest Interactive #SXSW2012

Sunday, March 11, 2012 - South by Southwest Interactive, Austin, Texas
by Fritz Onion – Editor in Chief of Pluralsight

A Quick History of Client-Side Templating

Demo Link

JavaScript Micro-templating

In July 2008, Jon Resig posted a little, JavaScript micro-templating function.

jQuery Templates

In 2010, Boris Moore worked on a fork of John Resig‘s protoype, but in April 2011, jQuery Templates were put on hold.

Create the template inside of script tags and then inject it via the DOM wherever you want on the page.

JsRender and JsViews

by Boris Moore, carried ideas of jQuery Templates forward with the goal of separating into two components.

JsRender – small fast pure string-based rendering with no DOM dependency
JsViews – takes DOM content rendered by JsRender and activates it to provide equivalent DOM integration features to jQuery Templates and data linking
not done, not quite in beta yet
at the moment, there are only demos, no tutorials or instructions, just a roadmap

You can take a look at a jQuery template-based library comparison.

jQuery Templates Cheat Sheet

${expr}

$item
$item.parent

Before I got it down the slide vanished and we were on to code examples. However, the jQuery Templates – step by step examples page could be used as a tutorial or instructional resource.

The session got into programming a sample demo page to show the power of jQuery templates. There is a lot of flexibility, as any functionality that is available via JavaScript is available to the template.