BackboneJS - examples of viewing caching

I am writing a BackboneJS application where each of the six tabs is represented by their own views. Should I save an instance of the view and just call it a function render()whenever the user clicks the tab that he has already been to? Or create a new instance and access the template that jQuery cached for me during the first rendering?

If I do the latter, I still need to make sure that the other collection is not retrieved through my JSON API, as this was done during the initialization of some views.

I currently store all instances of the view in my controller, but I was wondering if this was built in, or if there are better alternatives.

Greetings.

Update: here is my function loadCachedViewthat I use in my controller:

loadCachedView: function (name, view, collection){
    if (!this.views[name]){
        if (collection){
            this.collections[name] = new collection();
        }
        this.views[name] = new view({collection: this.collections[name]});
    } else {
        this.views[name].render();
    }
},

Therefore, in the imaging performance, I just go: this.loadCachedView('settings', SettingsView, SettingsCollcetion).

+3
source share
2 answers

I usually keep track of all my views in my controller. The controller then switches between available views based on nav events:

var Switches;
Switches = [];
Skepic.SwitchView = Backbone.View.extend({
    hide: function() {
        return this.el.detach();
    },
    show: function() {
        if (!_.include(Switches, this)) {
            Switches.push(this);
        }
        _.each(Switches, function(s) {
            return s.hide();
        });
        this.container().append(this.el);
        return $('html, body').animate({
            scrollTop: 0
        }, 'fast', "linear");
    },
    container: function() {
        if (this.options.container) {
            return this.options.container;
        } else {
            return $("body > .content");
        }
    }
});

This is the base view view for switching between one view and another. The controller will create the view (retrieving data as needed), and when you switch, you can perform your last checks in the overriden show () function in the view.

(note that I'm using detach in jQuery to continue event delegation)

+3
source

.memoize ?

+1

All Articles