In non-trivial applications, I usually end up having a "dumb JS object" that has nothing but data in it... a data structure. Might as well have been stored as JSON somewhere and given to me when needed. But in this case an AJAX request for JSON might be unwarranted.
Example: the ng-options
directive in AngularJS for dropdowns. I need to give it an array of objects, but storing that in my controller clutters it with a data structure that might well have been invisible most of the time. Many such cases, even outside angular.
One solution I can think of creating a file that does nothing but store and retrieve these objects and use that across the project, but that's unnecessary network and memory consumption (data that has no bearing on the current context is being fetched).
Another solution would be to make these objects at the bottom of the file. But they either need to be on the window object, or I'll need to write the boilerplate for storing and fetching objects in each file I work with (especially when using RequireJS). I could store this "storer/fetcher" on the window object and pass it the JSON in each file, but I feel there is room for improvement.
What would you suggest?