バックボーンコレクション/モデルのベストプラクティス

Question

私たちはより良い、このアプリケーションをモジュール化することを試みることができるので、だから、典型的なモデルは別のファイルに次のようになりますRequireJsとBackbone

を使用している：

define([ 
'Require statements here if needed' 
], 
function() { 
var toDo = Backbone.Model.extend({ 

    // Model Service Url 
    url: function() { 
     var base = 'apps/dashboard/todo'; 
     return (this.isNew()) ? base : base + "/" + this.id; 
    }, 
    // Other functions here 

}); 

    return toDo; 
}); 

今は各モデルとコレクションを独自のファイルに保存し、上記のようにモデル/コレクションを返します。アプリケーションが大きくなればなるほど、ファイルと命名規則をまっすぐに保つことが難しくなります。私は同様のコレクション/モデルを1つのファイルにまとめ、モジュール性を維持したいと考えています。

これを達成するにはどうすればよいでしょうか？あるいは、私はそれらを別々のファイルに貼り付け、より良い命名規則を得るべきですか？そうであれば、同様のコレクション/モデル間の命名規則には何を使用しますか？

Answer 1

これは私が自分のアプリケーションを構築方法です：

私は、サーバーたときにクライアントアクセス「/ javascriptの」によってオンデマンドで縮小化していjavascriptのパスを、持っているので、私は私の中に一つだけのスクリプトラインを持っていますindex.htmlを：/ javascriptのの

<script src='/javascript'></script> 

私のディレクトリ構造は次のとおりです。

application.js 
router.js 
lib/ 
lib/jquery.js 
lib/underscore.js 
lib/backbone.js 
lib/require.js 
lib/other_libraries.js 
views/ 
views/navigation.js 
views/overlay.js 
views/content.js 
views/page 
views/page/constructor.js 
views/page/elements 
views/page/elements/constructor.js 
views/page/elements/table.js 
views/page/elements/form.js 
views/page/elements/actions.js 
collections/ 
collections/paginated.js 

すべてのそれらのファイルが縮小さと最初の要求でクライアントからロードされます。これを行うことで、アプリケーションがRequireJSで任意の要求を行う前に、自分のコードがすでにブラウザにロードされています。

私のサーバーには、公開されているディレクトリがありますが、動的なjavascriptの読み込みとテンプレート用です（任意の時点でアプリケーションの要求によってアクセスされます）。ディレクトリには、次のようになります。

dynamic/ 
dynamic/javascript 
dynamic/javascript/pages 
dynamic/javascript/pages/articles.js 

dynamic/templates 
dynamic/templates/pages 
dynamic/templates/pages/articles.hb 
dynamic/templates/pages/items.hb 

ときに私のサーバー要求「/templates/pages/articles.hb」サーバーは、次のようになりますJSONオブジェクトを返します。

{ html : "<div class='page' id='articles'>blah blah blah</div>", javascript : "javascript/pages/articles.js" } 

をそして、私のクライアントアプリが受信したときに

：返されるJSONオブジェクト内の "javascriptの" プロパティには、それは私のようなものを持っているRequireJSは、ダイナミック/ javascriptの/ページ/ articles.jsで

if (typeof json.javascript === string) { 
    require([ json.javascript ], function(constructor) { 
     window.app.page = new constructor(); 
    }); 
} 

を要求するトリガー

define(function() { 
    var Model = Backbone.Model.extend({}); 

    // Collections.Paginated is in fact the Collection defined by /javascript/collection/paginated.js 
    // it is already loaded via the initial javascript loading 
    var Collection = Collections.Paginated.extend({ 
     url : '/api/articles' 
    }); 

    // Views.Page is in fact the View defined by /javascript/views/page/constructor.js 
    // it is also already loaded via the initial javascript loading 
    var articles = Views.Page.extend({ 

     collection : Collection, 

     initialize: function(options) { 
      this.collection = new Collection(); 
     }); 

    }); 

    return articles; 

}); 

かなりそれです。私はRequireJSで最小限の要求をしています。なぜなら、require（ 'something.js'）を押すたびにサーバーに要求が行われるため、アプリケーションの速度には不向きです。

あなたの質問の正確な答えは、私の考えでは、次のとおりです。最初に読み込まれたファイルを可能な限り分けてください。後でrequireJSでファイルを読み込むと、トラフィックを節約するためにできるだけ小さくする必要があります。