Precompiling with the requirejs-tpl plugin

With AMD, we simplified the template organization process, but the end result still remains an uncompiled template string. In Chapter 2, Working with Views, we saw how template compilation affects application performance every time and we also analyzed the benefits of precompiling templates. Won't it be useful if we have something that will load these template files and provide us with an already-compiled template string instead? Fortunately, there are multiple tpl plugins available for Require.js that automate template compilation, and you can use these plugins directly in your module definition. Let us look at a similar plugin (https://github.com/ZeeAgency/requirejs-tpl) developed by ZeeAgency. Dependency loading is exactly the same as it is for the text plugin, you just need to use the tpl! plugin prefix instead of text!:

 define(['tpl!your-template-path.tpl'], function (template) { 
  return template ({
    your: 'data'
  });
});

Now, r.js provides optimized and packaged precompiled templates. The tpl! plugin is surely more handy and useful than the text! plugin.

Template organization with Require.js is one of the best ways to maintain templates; a lot of JavaScript developers are opting for it nowadays. If you are using AMD for your Backbone application, go for it without any hesitation.