Caching best practice for AngularJS dynamic sites?

Question

I'm working on an AngularJS project that will have considerable traffic.

While in development I'm stumbled upon the issue with partials cached and not updated on different actions. Sure, I can get rid of this using .run with $templateCache.removeAll(); for example, but want to make sure this is actually a good idea.

Some partials are updated dynamically (user input, or automatically in intervals), while some are static or updated very infrequently.

What would be the best approach to caching in this case?

With non-angular sites I prefer to keep responsibilities cleanly split, for ex.: 1. Cache-headers are set on app level 2. nginx - just to serve sites per se 3. Varnish doing FPC + CDN for static assets or CDN doing full page caching (depending on a client/project, etc.) etc. etc. etc. Key point: every part has its own distinct responsibility.

With this project I can use Varnish and CDN for static assets, multi-server setup. Possibility to re-use Varnish for loadbalancing as well, i.e. I may have Varnish above several web-nodes. I have some flexibility in terms of infrastructure.

Please share your thoughts on the optimal setup? In particular: is it still worth caching partials? If yes, what would be the best place to set CC headers? What would be the best way to flush their cache then, esp. if I need to flush only some sub-selection?

Thank you!! D.

Answer 1

自己发布答案，因为无法选择抢劫回复作为答案。我的解决方案基于他的建议，这对我的前进有很大帮助：

在制作期间：

1. 我正在使用＆＃34; gulp-rev-easy＆＃34;用于加速以前的gulp模块 连接和uglified css＆amp; js文件。
2. 但是，没有现有的转换模块可以为我提供我需要的功能：用我自己的CDN路径替换index.html模板文件中的特定字符串，用于CSS和JS脚本。所以我不得不添加自己的功能/覆盖一点点。
3. 根据 rob 我开始使用templatecache，它与revving一起使用效果非常好。
4. 图片刚刚通过S3 - ＆gt; CDN对。

一些快速说明：

1. 使用转动＆＃34;打破＆＃34;缓存竟然是最快的 处理缓存的最简单方法，因为CloudFront需要大约。 20 分钟路径无效，其他CDN - 少，但你还有 发出请求等。
2. 用于具有相同名称的动态更新图像，例如头像图像 用户可以通过他的个人资料区域进行更新，我建议添加一个 时间戳或文件名的随机字符串。同时添加一个 随机网址路径听起来更容易，您无法缓存此内容。

希望这有帮助， 丹尼斯