テンプレートを使用したHTMLのビルドとjavascriptのビルド

Question

最近私はウェブアプリケーションを作り始めました。私はいくつかのものを作っていますが、ベストプラクティスについてはよく分かりません。

これまでは、Django、web.py、PHPのテンプレートシステムを使用していました。しかし、クライアントをリフレッシュせずにjQueryと素敵なajaxyの魔法を使ってサーバーからデータを取得しています.JavaScriptで直接HTMLを構築する利点があります（クライアントに小さなjsonオブジェクトを送信するだけで彼に何を変え、どのようにしたらよいかを把握させてください）。

これでテンプレートでレンダリングされたいくつかのビットがあります。また、JavaScriptとHTMLの両方を混在させた1つの恐ろしいケースでも、HTMLを作成するjavascript関数を生成するweb.pyテンプレートテーブル - Cマクロのような感じがもう一度！ （私は最終的にそれをリファクタリングします）

これはWeb開発の共通の問題ですか？ 「jsonをすべて使用し、javascriptで可能な限りレンダリングする」、「ライブラリfooを使用する」などの推奨されるベストプラクティスはどれですか？テンプレートを使って何を扱うべきか、またjavascriptで扱うべきものについての良いヒューリスティック？

ここでビットを検索すると、可能な解決策のように見えるasking about javascript templatesという人が見つかりました。

Answer 1

ページのレイアウトにJavascriptを使用しないでください。必要な場所でのみ使用してください。

最近の拡張機能や標準化にもかかわらず、Javascriptは一般的に遅く、完全な互換性がありません（古いIEなどと思う）、一部のスクリーンリーダーやスクレーパー/検索エンジンとの互換性がありません。

まっすぐなHTMLを返すことによってそれを行うことができれば、それは通常あなたが行きたい方法です。

Answer 2

JavaScriptのウェブサイトの機能をベースにしないでください。あなたがそうするなら、あなたはJavaScriptをオフにしているすべての訪問者を失うでしょう。本当にしたい場合は、javascriptをオフにしてユーザーを検出し、リダイレクトする必要があります。代わりの<noscript>を提供してください。さらに、クローラは現在JavaScriptの解析が可能ですが、ウェブサイトのSEOに対する大きな被害です。現在のモバイルデバイス、ネットブックなどで問題になる可能性のある互換性とオーバーヘッドの問題もあります。

Answer 3

私はいつも同じトラブルに遭いました。 web.pyテンプレートを使ってレンダリングするWebページがあり、それにはajaxページネーションがあります。だから、javascriptを使って次のページをレンダリングしなければならなかった。私はweb.pyテンプレートエンジンを拡張して、同じテンプレート出力をレンダリングするためのjavascript関数を生成しました。

は、より多くの詳細については、このブログ記事を参照してください。

http://anandology.com/blog/javascript-templating-with-webpy/

Answer 4

ここに少し関連questionがあります。

おそらく、同じテンプレートを両方とも使用することができます - this libraryは見えます。

テンプレートだけをサーバー上でレンダリングすることができます。the question上に効率的に行う方法があります。

必要に応じて、特定のテンプレートをjavascriptで複製できます。jqtemplateを試してください。

個人的には、おそらく、テンプレートの重複を避けるために、私はおそらくサーバー側でのみHTMLをレンダリングします。私のサーバーがJSON Webサービスのように機能し、おそらく他のクライアントにもサービスを提供していればJSテンプレートを作成します。

あなたのサイトがアクセス可能で、非jsフレンドリーであることが重要であれば、それはあなたのサイトをjsなしで完全に書いてからprogressively enhanceです。

Answer 5

AngularJSは、この質問をしてから数年後に発見された、クライアントサイドのテンプレート作成によく使用されるソリューションです。 DjangoのようにHTMLテンプレート（ "partials"）を書いてから、必要に応じてjavascriptを取り出して解釈することができます。コードとレイアウトを完全に分離したダイナミックなWebサイトと両方の世界を最大限に活用できます。