Is embedding handlebar templates in the main page recommended best practice?


It seems like all the examples I find embed the templates directly in the page, e.g. from


  <script type="text/x-handlebars" data-template-name="index">
    <h2>Welcome to Ember.js</h2>
    {{#each item in content}}

It seems like this would get unweildy for a large app. In my homegrown client side templating library I load the templates from a separate file (actually, from a lot of different source files that get combined and minified for production use). For big projects is there a standard way of doing this? How is Discourse doing it (I don’t see templates in view source here; I know it’s an open source project but I don’t know RoR and it seems tied up in erb sources…)?


Although this is perfectly acceptable, it’s recommended to bundle precompiled handlebars templates into JavaScript via Em.TEMPLATES["template/name"] = Em.Handlebars.compile('Template content goes here')

I’m not the best person to indicate how to do this in Rails; in .NET, however, I recommend using this library.


I think the option of adding the templates in index.html works quite well for small examples.

However, for bigger apps (and if you’re doing Rails), have you looked into ?

This does all the hard work for you. It creates a nice structure for you to put your handlebars templates under app/assets/javascripts/templates, and then pre-compiles the templates when building the asset pipeline.

I think it’s the best option.


I struggled myself with this question for quite some time. If you are using a backend framework like Rails @tsantos83 and @raul are absolutely right. For most frameworks there are working solutions which pre-compile Handlebar templates. Are you using any backend Framework?

If this is not the case, I encourage you to take a look at Cinder Plate ( . This is a skeleton for Brunch I specifically created for Ember.js development when you don’t use a backend. You get a nice structure for all your files, and it does a bunch of things for you. One of them is pre-compiling your templates. So maybe it’s the right thing for you.


Definitely pre-compiling… but where is the source of your templates during development? Still in index.html?


sorry, no Rails for me…


Brunch! I ran into this a few weeks back and bookmarked it but forgot about it. Definitely have to try it out.


With Cinder Plate / Brunch the templates live within the templates directory as files. So no template mess in the index.html file!

You can check it out here:


There are many solutions, this is a good comparison


great link darthdeus.


I keep the template source in the same location (~/scripts/app/templates/*.hbs), but I don’t minify during development.


No. Use a build tool.