Skip to content

doT.js Templates with Sprockets and Ruby on Rails

Browser Based Apps

With the popularity of browser based apps continuing to grow we’re seeing more and more on the web each day (here’s a list, if you’re curious).  I’ve recently jumped on board the backbone.js train and though it’s not perfect, I think this is a fantastic trend.  Browser based apps are run with JS and are completely client side (though most use some sort of backend API to fetch/save data).  As a consequence of this, your normal templating practices must change.  Your Ruby on Rails .html.erb files are no longer used (for 99% of the views), and though some setups opt to fetch raw HTML from the server you’ll mostly be fetching raw data in JSON form.  This means that you’ll need to use one of the many client side templating engines that exist.

Compiling the templates turns the HTML-based template files you write into JavaScript functions that return the HTML for the page.  These JS functions work essentially the same way as Rails save for the minor idiosyncrasies of the different engines .  The compiling can be done in the browser with JS, but you can save a lot of time by precompiling them on the server side and distributing the precompiled templates on each page load (instead of compiling them every time someone loads your app in their browser).  Sprockets (the tool that powers the Rails asset pipeline) supports precompiling of one type of JS template engine, EJS templates.

EJS templates will get the job done, but there are definitely more performant templating engines out there.  doT.js is one of those engines and it claims to be the fastest and most concise engine on the market.  I’m a big fan of doT.js myself and wanted to use it to power the JS templates in my backbone.js based browser app.  My app is powered by Ruby on Rails, and unfortunately the asset pipeline (Sprockets) doesn’t support precompiling doT.js templates.

Enter sprockets-dotjs

With sprockets-dotjs, Sprockets and the Rails asset pipeline support precompiling doT.js templates!  The templates are handled in the same way that the already supported EJS templates and handled, and do not interfere with any existing templates you may have.

Using sprockets-dotjs is simple.  Just add the gem to your Gemfile and run a bundle install.  Then in your assets/javascripts directory create template files in the format specified by the doT.js docs with the extension .jst.djs.  The gem will automatically pick up on this extension and your templates will be compiled along with the rest of your assets.

Check out the documentation on the GitHub page for more information on how to use the gem and the doT.js documentation for information on the templating engine itself.


It should be noted that this is a very simple plugin with a very small set of features that was conceived and created in a very short amount of time.  Due to this fact it may not be perfect, so please keep an eye out for any issues and report them via GitHub.


Categories: Programming, Ruby on Rails, Web Development.

Comment Feed

6 Responses

  1. Wow that was odd. I just wrote an incredibly long comment but after I clicked submit my
    comment didn’t show up. Grrrr… well I’m not writing all that
    over again. Anyhow, just wanted to say fantastic blog!

  2. HCG homeopathic diet is one of the solutions which are gaining immense popularity for
    their popularity in helping people to lose weight speedily and in effective manner.

    HCG can be used by individuals (male or female) to lose weight also.
    This type of diet is based on the justification that
    grapefruit has a fat-burning enzyme or identical property.

  3. I have read so many articles about the blogger lovers however this post is in fact a nice piece of writing,
    keep it up.

  4. Every weekend i used to pay a visit this web page, for the reason that i want enjoyment, for the reason that this this site conations genuinely nice funny information too.

  5. This is a great tip particularly to those new to the blogosphere.

    Brief but very accurate information… Thanks for
    sharing this one. A must read article!

  6. What’s up it’s me, I am also visiting this website daily,
    this site is truly pleasant and the users are actually
    sharing fastidious thoughts.

Some HTML is OK

or, reply to this post via trackback.