jsRender (client-side lightweight templates)

jsRender (client-side lightweight templates)

This morning, I came across a blog post about jsRender:


It's a lightweight template renderer that can be used with (or without) jQuery.

http://www.jsviews.com/ (try-it demo)

Somehow, I hadn't heard of it before.

I find it very attractive for my work. I write hybrid mobile apps using the Rhodes platform, and in Rhodes pages are (generally) produced from ERB templates and served by an internal server that takes an MVC approach. So, I have no use for the over-complicated MVC and MVVM javascript libraries like Angular, React, Backbone, etc.

But I do have an occasional need to generate small amounts of HTML in JS code and it seems silly to make a round-trip to the server (even though local on the device) to render a template using Ajax. So, I'm afraid I use the tried-and-true but ugly and error-prone method of pasting together some strings.

I've found a good rule in software development is the "rule of 3". If you repeat the same code 3 times, time to bundle it up into a function, etc. You can extend that to "if you use the same painful and error-prone construct 3 times..."

Well, I definitely do that more than 3 times!

jsRender has a long and convoluted history. It came out of an effort to add template support to jQuery. Or jQuery UI. Or something like that... I don't think the blog author above quite got the history right.


Wow, that was back in 2011!  I'm curious: have the jQuery developers decided to permanently get out of the "template business"? Well, I suppose it makes sense to step back, because their are so many opinions on how to do templates.

Interested in hearing comments from anyone using this. While perhaps a "blast from the past", it looks like it is currently-maintained, and there is now also jsViews and jsObservable to go-along with it.

Has anyone here used both Mustache (or Handlebars) and jsrender? Which do you prefer? Obviously, Mustache has popularity going for it. 

I looked at some benchmarks, and almost all of the popular JS template rendering engines have similar performance.

Handlebars is about 50% more code (minified) than jsRender. (Though both are fairly small).

I am not looking for something to do the heavy lifting for an entire site. Just something to replace the silly paste-together code that I occasionally use client-side.

(And, yes, I've been planning on moving to ES5 and then use Babel to generate ES4 for Android apps, because Android users don't update and/or they are blocked from updating by manufacturers and carriers... That at least would allow me to use backticks instead of pasting-together a bunch of strings...)