Harry Wolff

You can't escape my laugh.

Fix Mustache Templates From Being Cached

May 24, 2012
Read time 1 minute

For development I've grown to love using Mustache templates. Encouraging presentation and layout over logic and control-flow make for template files that are easy to read and update at later points, as all that exists are template tags and HTML markup.

In developing a fully client-side project I ran into the annoying problem of Mustache templates becoming strongly cached by Chrome. I'm using require.js as my file and module loader which I'm sure made my caching problem worse. Each template is its own .mustache file that require.js loads into the page for use by Backbone View's.

So after I edited a Mustache template and reloaded the page I wouldn't see my template changes reflected. The first time this happened I was quite confused. I didn't know where the breakdown began as the only thing that changed was the template file.

After digging through the Network tab I found that the template file being loaded by require.js was still the old one.

I temporarily fixed this by emptying Chrome's cache, however having to do this after every template change proved tiresome.

Thankfully the wonderful developers of Chrome's Web Dev tools put in a setting that fixed this problem for me.

Simply check 'Disable cache' and you'll be able to edit your Mustache templates without fear of them being cached by Chrome.