JavaScriptテンプレートエンジンを優先してjQuery DOM操作を回避する必要がありますか？
私が言うことができることから、ほとんどの開発者は、jQuery DOMの大量の操作方法を使用して、更新されたAJAX=ビューを提供します。問題が解決しない場合、Mustache.jsなどのテンプレートエンジンを使用したリファクタリングを検討する可能性があります。これは、テンプレートエンジンを使用するための自然な進行の有効な評価ですか？
新しいAJAX=重いプロジェクトを開始するとき、テンプレートエンジンを使用するのがベストプラクティスですか、それともjQuery DOM操作で十分ですか？
テンプレートエンジンを使用して、まだネガティブな点を見つけていません。保守性、効率、シンプルさは、償還の資質のようです。
JavaScriptテンプレートエンジンをデフォルトで使用するかどうかを教えてください。
@ジェイソン、これらのメモが私の頭に浮かびます：
- JavaScriptテンプレートは、ほとんどの場合、基になるデータソースとしてリスト（または配列）がある場合に便利です。たとえば、アクティブな従業員のリストをサーバーからJSON形式で取得する場合、各従業員をループして、文字列と従業員のプロパティを連結してHTML要素を作成するのではなく、戻り時にJavaScriptテンプレートにバインドすることをお勧めします（AJAX応答）。 。
- ただし、JavaScriptバインディングが単にオーバーヘッドである場合があります。ほとんどの場合、レコードのリストはありません。代わりに、AJAX応答に単一の値があります。たとえば、stackexchangeサイトに投票すると、戻り値はリストではないため、JavaScriptでの使用には適していません。テンプレート。
JavaScriptテンプレートを使用できないもう1つの状況は、同種のデータソースではなく、異種のデータソースです。たとえば、AJAXリクエストへの応答として、次のJSON文字列を返すことができます。
"{"firstName":"Saeed","lastName":"Nemati","isEmployed":true,"interests":["computer","music","language","philosophy","mathematics","physics"],"voteDirection":"up","totalScore":5}"
これは、従業員と投票アクションの複雑なオブジェクトです。これらのシナリオでも、JavaScriptテンプレートは使用できず、DOM操作を直接使用する必要があります。
- JavaScriptリファクタリングまたはjQueryリファクタリングは、優れたレベルで役立つ高度なツールがまだないため、頭痛の種になることがあります。したがって、たとえば、
<div class='employee'><h1>Saeed Nemati</h1></div>AJAX応答のHTMLフラグメントが多くの場所にあり、次に<a>タグの代わりに<h1>タグ、これに集中する必要があります。
それは、必要な機能や複雑さ（テンプレート作成が必要な場合もあれば、やり過ぎの場合もあります）と必要な機能に依存します。
機能性が重要な場合の例として、Mustache.js（および他の多くのテンプレートシステム）がDOMについて何も知らないという点を考慮してください。そうすれば、実際にはpdateテンプレートを使用できません。 -render、つまりreplace it。ある状態を保持したくない場合があります（ "<details> "要素はモデル内で展開されているかどうか）。DOMサブツリー全体を新しくレンダリングされたテンプレートで置き換えると、この状態が失われます。DOMノードを値にバインドできるテンプレートシステム（たとえば、Knockout.js）があります。ただし、この問題に対処してください。
DOMを更新するテンプレートのいくつかの欠点は、JavaScript側である種のMVCパターンを使用することで軽減されます-JSONは、テンプレートを介して、または直接DOMを更新できるコントローラーオブジェクトによって監視されるJavaScriptモデルオブジェクトを更新します。
これはリファクタリングがはるかに容易であり、複数の場所でHTMLフラグメントを繰り返すよりもDRYです。また、JSONオブジェクトを使用してモデルを更新するコードを1回記述するだけでよいため、複雑なJSONを処理するのにも適しています。 DOMの詳細には依存しません。