7

I'm trying to implement some cache busting on my angular application in a way that it will still allow caching but break it anytime we push new code to production. My setup so far involves using grunt cache-breaker https://www.npmjs.org/package/grunt-cache-breaker to dig through my concatenated angular app.js file and append query params to any string ending in a .html file extension. I also do this for any template files I have that are using an ng-include. One complication this creates is that now I need to first copy my template files to a dist/ directory so I can safely .gitignore the cache-busted versions and not have to commit all of my templates everytime the cache is busted (and create conflicts).

My question is not how to do this but more of a sanity check as to if this is a practical way of avoiding template caching on new code? I have seen examples of disabling template caching in angular but it seems like it is something I would want to use in between code pushes when files are not changing.

How do other navigate this issue?

Constellates
  • 2,083
  • 3
  • 19
  • 29

1 Answers1

9

I think a popular approach is to use something like ng-templates (with a grunt plugin) to generate a JS file that pre-caches all of your templates. Then use the usemin grunt workflow along with an asset versioning task to version the JS file.

mfollett
  • 1,814
  • 15
  • 27
  • I finally found some time to dig into this. I learned a lot about how angular caches templates. This was a very nice and simple to implement solution on a project already using grunt quite a bit. And it brought some performance improvements aside from solving caching issues. Thanks for the tip. – Constellates Aug 03 '14 at 15:12
  • @mfollett @Constellates, According to [angularjs-how-to-clear-routeproviders-caches-of-templateurl](http://stackoverflow.com/questions/20284976/angularjs-how-to-clear-routeproviders-caches-of-templateurl), if we directly use `$routeProvider`, we already get `$templateCache`. So I think, `grunt-angular-templates` is not required. Only `usemin` can suffice. I might be wrong, but just trying to analyze on what you have specified. – Nagaraj Tantri Aug 24 '15 at 07:48
  • Template cacheing is provided by `$routeProvider`, but you still have to have something that pre-populates the template cache. That's what the grunt plugin is for. – mfollett Aug 24 '15 at 14:17