Mustache.jsとHandlebars.jsの違いは何ですか？

私が見た主な違いは次のとおりです。

• ハンドルバーが追加され#if、#unless、#with、および#each
• ハンドルバーはヘルパーを追加します
• ハンドルバーテンプレートがコンパイルされます（Mustacheも可能です）
• ハンドルバーはパスをサポートしています
• {{this}}inブロックの使用を許可します（現在のアイテムの文字列値を出力します）
• Handlebars.SafeString() （そしておそらく他のいくつかの方法）
• ハンドルバーは2〜7 倍高速です
• Moustacheは反転セクションをサポートしています（つまりif !x ...）

（上記に誤りがある場合は訂正してください。）

他に欠けている大きな違いはありますか？

あなたはほとんどそれを釘付けにしましたが、Mustacheテンプレートもコンパイルすることができます。

Moustacheはロジックレスを目指しているため、ヘルパーとより高度なブロックがありません。ハンドルバーのカスタムヘルパーは非常に便利ですが、多くの場合、テンプレートにロジックを導入することになります。

Moustacheには、さまざまなコンパイラ（JavaScript、Ruby、Python、Cなど）があります。ハンドルバーは、今のようなプロジェクトがあり、JavaScriptで始まったジャンゴ・ハンドル、handlebars.java、ハンドル、ルビー、lightncandy（PHP） 、およびハンドル-にObjCが。

口ひげプロ：

• 大規模で活発なコミュニティで非常に人気のある選択肢。
• Javaを含む多くの言語でのサーバー側のサポート。
• ロジックなしのテンプレートは、プレゼンテーションをロジックから分離することを強いる素晴らしい仕事をします。
• きれいな構文は、構築、読み取り、保守が容易なテンプレートにつながります。

口ひげの短所：

• 少し論理が足りません。基本的なタスク（たとえば、異なる行に異なるCSSクラスのラベルを付ける）は困難です。
• 多くの場合、ビューロジックはサーバーにプッシュバックされるか、「ラムダ」（呼び出し可能な関数）として実装されます。
• ラムダをクライアントとサーバーで機能させるには、JavaScriptで記述する必要があります。

ハンドルバーの長所：

• ロジックなしのテンプレートは、プレゼンテーションをロジックから分離することを強いる素晴らしい仕事をします。
• きれいな構文は、構築、読み取り、保守が容易なテンプレートにつながります。
• 解釈されたテンプレートではなくコンパイルされたテンプレート。
• 口ひげよりもパスのサポートが優れている（つまり、コンテキストオブジェクトの奥深くに到達する）。
• 口ひげよりもグローバルヘルパーのサポートが優れています。

ハンドルバーの短所：

• サーバーでレンダリングするには、サーバー側のJavaScriptが必要です。

ソース：クライアント側のテンプレートスローダウン：moustache、handlebars、dust.jsなど

1つの微妙ですが重要な違いは、2つのライブラリがスコープにアプローチする方法です。Mustacheは、現在のコンテキスト内で変数を見つけることができない場合、親スコープにフォールバックします。ハンドルバーは空の文字列を返します。

これは、GitHub READMEでほとんど言及されていません。そのための行が1つあります。

ハンドルバーは、デフォルトでは再帰的なルックアップを実行しないという点で、Mustacheから少し逸脱しています。

ただし、そこに記載されているように、ハンドルバーをMustacheと同じように動作させるフラグがありますが、パフォーマンスに影響します。

これは、#変数を条件として使用する方法に影響します。

たとえば、Mustacheではこれを行うことができます。

{{#variable}}<span class="text">{{variable}}</span>{{/variable}}

基本的には、「変数が存在し、それが真実である場合、その変数を含むスパンを出力する」ことを意味します。しかし、ハンドルバーでは、次のいずれかを行う必要があります。

• {{this}}代わりに使用
• 親パスを使用する、つまり{{../variable}}関連するスコープに戻る
• variable親variableオブジェクト内で子の値を定義する

詳細については、こちらをご覧ください。

注： この回答は古くなっています。それは投稿された当時は真実でしたが、もはやそうではありません。

Mustacheには多くの言語のインタープリターがありますが、HandlebarsはJavaScriptのみです。

それらの別の違いは、ファイルのサイズです。

• Moustache.jsには9kbがあり、
• Handlebars.jsのサイズは86 kb、またはプリコンパイル済みテンプレートを使用している場合は18 kb です。

Handlebars.jsのパフォーマンス上の利点を確認するには、プリコンパイルされたテンプレートを使用する必要があります。

出典：JavaScriptテンプレートエンジンの概要

もう1つの微妙な違いは、{{#property}}...{{/property}}ブロック内の偽の値の扱いです。ほとんどの口ひげの実装は、ここではJSの虚偽に従うだけで、propertyis ''または '0'の場合はブロックをレンダリングしません。

ハンドルバーは、''およびのブロックをレンダリングしますが、0他の偽の値はレンダリングしません。これにより、テンプレートの移行時に問題が発生する可能性があります。

「ハンドルバー」について述べた短所の1つは、もう本当に有効ではないと感じています。

Handlebars.javaにより、クライアントとサーバーの両方で同じテンプレート言語を共有できるようになりました。これは、SEOのサーバー側レンダリングを必要とする1000以上のコンポーネントを含む大規模プロジェクトにとって大きなメリットです。

見てくださいhttps://github.com/jknack/handlebars.javaを

-ハンドルバーに「this」を使用し、口ひげの変数ブロック内のネストされた変数に加えて、口ひげのブロックでネストされたドットを使用することもできます。

    {{#variable}}<span class="text">{{.}}</span>{{/variable}}