胡子渲染与手柄渲染

Question

我有两个视图- view1使用胡子和view2使用把手。我想确认一下我的理解是否正确-

在调用视图的呈现函数时，呈现view2的性能将优于view1，因为我已经在初始化块中编译了工具栏模板，而在呈现视图时，我将数据传递给编译的模板。

而在view1使用胡子的情况下，模板编译和数据填充会在呈现过程中发生。

如果我的理解是正确的，请告诉我。我试图检查视图的加载时间，但在加载时间上没有任何明显的差异。view1为10.8ms，view2为10 ms。

 var view1 = Backbone.View.extend({

            initialize:function(options){

                 Backbone.View.prototype.initialize.call(this);

                 this.tpl = options.template;

                 this.data = options.data;

            },


            render: function(){

                 $(this.el).html(Mustache.to_html(this.tpl,this.data));

            }
        });


 var view2 = Backbone.View.extend({

            initialize:function(options){

                  Backbone.View.prototype.initialize.call(this);

                  this.tpl = options.template;

                  this.handlebarstpl = Handlebars.compile(this.tpl);

                  this.data = options.data;

            },


            render: function(){

                 $(this.el).html(this.handlebarstpl(this.data));

            }
        });

Answer 1

你的理解是正确的。预编译模板比在客户端编译模板花费更少。

你说这两个视图之间有0.8秒的差异。虽然这个数字看起来很小，但所有这些都会给你一个更快(更好)的结果。用户体验。一旦模板数据更大，您可能会看到两者之间更显著的差异。

这应该给你一个公平的想法。