2

https://github.com/ccoenraets/backbone-jax-cellar/blob/master/WebContent/js/utils.jsから:

tpl = {

// Hash of preloaded templates for the app
templates: {},

// Recursively pre-load all the templates for the app.
// This implementation should be changed in a production environment. All the template files should be
// concatenated in a single file.
loadTemplates: function(names, callback) {

    var that = this;

    var loadTemplate = function(index) {
        var name = names[index];
        console.log('Loading template: ' + name);
        $.get('tpl/' + name + '.html', function(data) {
            that.templates[name] = data;
            index++;
            if (index < names.length) {
                loadTemplate(index);
            } else {
                callback();
            }
        });
    }

    loadTemplate(0);
},

// Get template by name from hash of preloaded templates
get: function(name) {
    return this.templates[name];
}
};

私は何かをする必要があります

$.get('tpl/all-tpls.html', function(data) { }

すべての html テンプレートを取得するには? それは大量の html を不必要にフェッチしているのではないでしょうか? 私たちのアプリは Java で構築されており、https://github.com/samaxes/minify-maven-pluginを使用して、js ファイルと css ファイルを縮小して結合しています。任意の方向をいただければ幸いです。

4

1 に答える 1

3

簡単な答え:はい。アプリの読み込み時にすべてのテンプレートを最初に読み込んで、使用できるようにする必要があります。本番環境では、これを正しい遠い将来の有効期限ヘッダーの提供と組み合わせて、訪問の合間に(つまり、1年)ユーザー用にテンプレートをキャッシュすることができます。次に、次のようなクエリ文字列を使用してキャッシュを無効にすることができます。tpl/all-tpls.html?v=001

長い答え

パフォーマンス上の理由から、ロード時間とリクエスト数を可能な限り減らすことを目指したいと思うでしょう。これは、テンプレートがすでに利用可能である場合に新しいセクションをロードする際の遅延が少ない場合、アプリの応答性を高めるのにも役立ちます。

テンプレートを組み合わせてキャッシュすると、アプリが非常に大きくなるまで効果的です。その時点で、たとえばアプリのセクションに基づいたグループに読み込みを分割することをお勧めします。ただし、これをライフサイクルパフォーマンスの最適化と考えてください。それだけのために事前に最適化しないでください。

于 2013-02-20T01:39:59.003 に答える