I’m very pleased to announce the release of my new jQuery plugin, tmpload.
It’s no secret that I’m a big fan of client-side templating and the official jQuery Templates (aka tmpl) plugin is really quite fantastic.
I especially like the idea of templates in external files. Generally there are two ways that external templates are implemented:
- Including them in a script block, downloading them when the page loads; or
- Downloading them in parallel when the matching AJAX request is made.
Both of these are absolutely fine. However, I wanted more fine grained control over when the downloading of the templates happens. For example, I would sometimes like to download a template as soon as the user focuses on a search form. That way it’s never downloaded if they don’t use the search form, and if they perform a search, the template is already downloaded and cached as soon as they need it rather than downloading after they submit their search.
Templates can also be compiled and saved to a variable using the $.template function and, seeing as the biggest performance hit with client side templates is the initial parsing of the template, I really wanted template caching to be taken care of automatically.
Solving these two problems inline requires quite a bit of messy ‘plumbing’ code, decreasing readability and maintainability while discouraging best practices due to increased complexity.
This is where tmpload comes in.
Tmpload aims to provide a dead-simple way to implement external templates that can be loaded and cached at will, with easily understandable calls to the $.tmpload function.
Declaring a template:
Declaring groups of templates:
1 2 3 4 5 6 7 8 9 10
Loading the template and caching it, or referencing it in an AJAX ‘when’ block:
That’s all there is to it! Grab a copy and try it out yourself. I’d love to hear your feedback and suggestions.