serializeData function vs Marionette.renderer for custom data

Question

I've noticed Marionette is very un-opinionated as far things go for the freedom they give you to choose a method to render data. It seems like there are a lot of ways to initially render a template with custom data

Returning a template with data:

template: function () {
    var myTemplate = $('.someTemplate')
    return _.template(myTemplate.html())({some: data});
}

Very similarly:

    render: function () { 
        var template = this.getTemplate();
        var html = Marionette.Renderer.render(template, {
            model: this.model.toJSON(),
            customData: this.customData
        });

        this.$el.html(html);
    }

Serialize data:

serializeData : function () {
    var customData = {some: 'data'};
    var model = this.model.toJSON()
    return _.extend(customData, model);
}

I've seen a lot of people in different code use variations of the first and the second. I personally prefer using serializeData but am curious: is there an advantage or use case where it would be appropriate to use the first two methods instead of serializeData?

Answer 1

The first case is not efficient - you are recompiling the template every time you want to render.

Anyway, your use case is exactly why Marionette has templateHelpers. Its the most concise way to provide extra data to the template while also passing serialized model.

So you would write:

templateHelpers : function () { return {some: 'data'}; }

Or if its just static stuff:

templateHelpers: {some: 'data'}

More examples on how to use it here.