2012-01-20 24 views
11

私はEmber.jsをthis articleまで発見しました。Ember.jsコードの概要

ドキュメンテーションの目立つ部分は非常に印象的なツールです。ソースコードを見ると、怪物が明らかになります。ソースの "コンパイル済み"バージョンは約15000行のコードであり、GIT repoはファイルがいっぱいです。

JavaScriptのフレームワークを学ぶことに自分自身を乗り出したいと思っても、少なくともコードのグローバルな理解はできないと思っていました。 (jQueryまたはBackboneの品質の1つは、コードベースが比較的単純であるということです)。

コードをナビゲート(および最終的に理解)するためのアドバイスはありますか?

+5

重要なサイズのフレームワークは、通常、複数のファイルに分割されます。より小さいjQueryでも分割されます。 @ebrynが説明しているように、それは実際にはすべて非常に整理されています。さらに、EmberにはjQueryやBackboneよりも多くの機能があるため、サイズが大きくなることは驚くことではありません。 –

+3

コードをナビゲートするには、開始点はここにあります:https://github.com/emberjs/ember.js/tree/master/packages –

答えて

31

Ember.jsは、最も関連性の高いものも含めて、いくつかのパッケージで構成されています

  • 燃えさし-金属
  • 燃えさしランタイム
  • 燃えさし-ビュー
  • 燃えさし-ハンドル
  • エンバールーティング

また、いくつかのバンドルの依存関係があります:オブザーバー、バインディング、計算されたプロパティ、および実行ループ:

  • ハンドルバー
  • をMetaMorph

金属には、いくつかの基礎技術から構成されています。

RuntimeはEmberオブジェクトシステムといくつかの有用なクラスを提供します。オブジェクトシステムは、金属で実装された多くの基礎技術で構築されていますが、アプリケーション開発者にとってはよりクリーンな方法でそれらを公開します。

ember-viewsパッケージはかなりわかりやすく、ランタイムの上に構築されたEmberビューシステムです。さらに、Ember-viewbarsパッケージは、Ember-viewに依存して、Handlebarsテンプレートシステムの上に自動更新テンプレートを提供します。

ember-routingパッケージは、アプリケーションの構造と状態を維持するシステムを提供します。ビューをアプリケーションの特定の部分に接続したり、状態を移行することができます。詳細はRouter code source

ハンドルバーの詳細についてはHandlebars websiteをご覧ください。

Metamorphは、EmberのDOMバインディング機能を有効にするDOMの特定の部分を更新する機能をEmberに提供するYehudaとTomによって書かれた小さなライブラリです。

+21

Emberにも注目する価値があります。jsは豊富に文書化されており、出荷されていないember.jsにはその文書が含まれています。 私はコンパイルされたソースに対してcloc(行のコードカウンタ)を実行し、空白行3,214行、コメント行4,800行、コード7,328行を取得しました。また、コンパイルされたソースにはHandlebars.jsが含まれており、1,314行のコード(Jisonパーサジェネレータのコンパイルされた出力を含む)にクロークロすることに注意してください。これにより、Ember.jsは約6,000行の実際のコードを作成します。 これは明らかにバックボーンほど小さくはありませんが、EmberはBackboneよりもはるかに優れています... –