Currently, I have successfully implemented RequireJS and a Grunt-based build process that optimizes my JS app into one file using r.js. This consolidation of all app files has proven to be efficient for production deployment.
However, the issue arises with the r.js optimization including all templates in the main app JS file. While this is beneficial for templates needed at app initialization or shortly after, it poses a problem for templates that may not be used until later in the app's lifecycle. It would be more advantageous if these templates could be loaded asynchronously as required.
Therefore, my query is whether there is a method to selectively exclude certain templates from being merged into the monolithic app JS file and instead load them asynchronously with RequireJS. If such functionality is not supported, what are the alternative approaches for async template loading?
My current setup utilizes the tpl text template plugin along with Backbone.Marionette. An example of my template usage can be seen below:
define(function (require) {
var Backbone = require("backbone");
var tpl = require("tpl!./some-view-template.tpl");
return Backbone.Marionette.ItemView.extend({
template: tpl
});
});