Documentation

Mustache Template Compilation

Cassette enables you to pre-compile Mustache templates into JavaScript on the server-side and render them using Hogan.js. The compiled templates are cached and served to the browser as a regular script. This also provides all the benefits of Cassette's bundle versioning and caching.

The compiled template functions are loaded into a configurable global variable.

Install Cassette.Hogan

Install the Cassette.Hogan package from nuget

Install-Package Cassette.Hogan

Configuration

The plug-in will automatically configure the default HTML template pipeline to be the HoganPipeline. So any HtmlTemplateBundles that you add will use the HoganPipeline.

To configure the global JavaScript variable that will store the templates, add the following:

using Cassette;
using Cassette.Hogan;

public class HoganConfig : IConfiguration<HoganSettings>
{
    public void Configure(HoganSettings settings)
    {
        settings.JavaScriptVariableName = "myvar"; // The default is "JST"
    }
}

Using in pages

In a view page, reference your templates just like any other bundle:

@{
    Bundles.Reference("HtmlTemplates");
}

Also, tell Cassette where to render the HTML required to include the templates:

...
  @Bundles.RenderHtmlTemplates()
  </body>
</html>

Now when the page runs, instead of embedding the template sources into the page, a single script include is generated:

<script src="/cassette.axd/htmltemplate/HtmlTemplates_7d879cec" type="text/javascript"></script>

This script will return the templates compiled into JavaScript. Like all Cassette bundles, it is versioned and cached aggresively. So a browser only needs to download it once.

Templates will be accessible via the global object. To render a template using Hogan.js using the render method:

var myHtml = templates['myTemplate'].render(myData);