問題タブ [client-side-templating]

過去数週間、私はjQote –クライアント側のテンプレートプラグインを使用して、実行時にhtmlフラグメントを生成してきました。

何ヶ月もの間、私は重要なデータを保存するために、id、class、altなどのdom属性を使用してきました。

.data()今、私はデータを保存および取得するためのjqueryのメソッドについて知るようになりました。

私のプロジェクト全体で、テンプレートを使用して動的にhtmlフラグメントを生成しています。

次に、これらのテンプレートで.data（）を動的に使用し、動的に作成された要素内に重要なデータを格納する方法を知る必要があります。

テンプレートのjsコードは次のようになります。

レンプレート：

解決：

この行が実行された後、その要素はDOMで使用可能になりました。

だから、あなたはこれをすることができます、

AJAXを使用してサーバー側からテンプレートを取得しているため、大量のトラフィックが発生してからしばらく経ちました。

異なるデータのみを使用して1つのページに同じHTMLをフェッチすると、それよりもうまくできることに罪悪感を感じることがあります。

それからアイデアが頭に浮かび、クライアント側のテンプレートについて調べました。

私が十分に良いと思ったのは（まだ練習していないのでそう思った）、jQote2http : //aefxx.com/jquery-plugins/jqote2/だけでした。

私はそれが価値があるという教祖からの提案が欲しいだけですか？別の良い選択肢はありますか？

テンプレートを一度定義して、それらを使用してサーバー側とクライアント側の両方から html をレンダリングできるようにしたいと考えています。（DRYの原則とそのすべて）

私が思い描いている API は単純に次のとおりです: render(JSON, template) --> html.

私はJavaフレームワークを使用しています（実際にはPlayフレームワークですが、これはフレームワーク固有ではないと思います）。

同様の質問をたくさん読んだことがありますが、最新で最も役立つのは、クライアント側とサーバー側の両方のレンダリングのためのテンプレート言語です。

私は、Mustache や Google Closure Templates のような明白な候補がそれをカットするつもりはないという著者にほぼ同意します。（理由についてはその投稿を参照してください）

要件：

• MUST: クライアント側のレンダリング
• MUST: テンプレートファイルのクライアント側キャッシュ
• NICE: クライアント側の「一度コンパイルしたら何度も実行」するテンプレート ファイルから高速な JavaScript コードへ
• MUST: サーバー側のレンダリング
• NICE: ネイティブ Java 実装

サーバー側のテンプレート作成に Node.js を使用することを提案する投稿をたくさん見てきました。これは間違いなく機能しますが (アンダースコア テンプレート、Handlebarsjs、EJS はすべて正常に機能します) Node.js を Java と通信/結合/統合する方法を理解するのに苦労しています。結局のところ、JSON を出力する必要があるのは Java フレームワークです。

JVM と node.js の間で (http 経由または JNDI を使用して) 通信する概念実証について言及している投稿を見てきました。ただし、現時点では、実戦テスト済みのライブラリはもちろん、利用できるライブラリもないようです。

まとめとして、Javaでも実行できる（またはいくつかのフープを使用して、jvmから呼び出すことができる）クライアント側のテンプレートエンジンを提案してください。そして、その「フープ」がたまたま Node.js である場合、コミュニケーション/ライブラリのどの方法を使用することをお勧めしますか?

クライアント側のテンプレートは次のようにする必要があります (アンダースコアのテンプレート エンジンを使用):

別の HTML ファイルまたは別の JavaScript ファイルに配置されますか? 私はそれが両方の方法で機能することを知っています。

たとえば、JavaScript ファイルには、次のような文字列変数のリストを含めることができます。

しかし、私は次のことも見ました：

関心の分離の観点から、テンプレート ストレージはどこに属するのでしょうか?

Illustrator で「SVG として保存」した場合の典型的な結果は次のとおりです。

HTML と同様の方法で SVG を使用できる JavaScript テンプレート ライブラリ (口ひげ、ハンドルバーなど) があるかどうか知りたいです。
これにより、一連の SVG 要素テンプレートを保存し、それらのスタイル属性とコンテンツを動的に設定できます ...

イントロ

私は現在、非常に標準的なDjangoベースのアプリ（基本的には派手なCRM /連絡先リストのようなもの）を書いています。これは一種の機能ですが、（jQueryを使用して）ますます多くのAJAXy UIコードを使用してインターフェイスを改善しようとすると、作業が非常に困難になり始めています。DOMを解析し、変更をサーバーにプッシュして戻し、JSONを取得し、それに基づいてDOMを更新しようとする、壊れやすいjQueryイベントハンドラーの長いブロックを取得しています。

少なくとも、クライアント側のテンプレートをいくつかミックスに追加したいと思います。または、JSフレームワークに切り替えて、Djangoアプリをデータベース抽象化レイヤーとして使用することもできます。または、Pythonを知っていて大好きですが、Djangoアプリを放棄して、JS/Node.jsソリューションなどを試してみることができます。

他の誰かがこの状況にありましたか？どのようにそれを解決しましたか？

設計目標

1. DRY：モデルやテンプレートを複製する必要はありません（少なくとも、必要以上に複製する必要はありません）。
2. ページにアクセスした訪問者に、サーバー側でレンダリングされた結果を取得してもらいたい。
3. 訪問者が物事をクリックすると、クライアント側のテンプレートとレンダリングを介してそれを処理し、RESTインターフェイスへのAJAX呼び出しを介してサーバーを最新の状態に保ちたいと思います。

だから...どうすればこれを行うことができますか？いくつかのフレームワークとテンプレートシステムへのリンクを集めました。順不同：

dust.js：

これは、LinkedInが同様の問題を解決するために使用しているようです。サーバー側でNode.jsを使用しますが、これは理想的ではありません（Nodeを使用したことはありません）が、少なくともJVMベースではありません。また、githubでは休止しているようです-メンテナがどこに行ったのか疑問に思っているメーリングリストを見つけました。それはかなり良いように聞こえます-LinkedInからのブログ投稿は、テクノロジー、特にそれをコンパイルする機能を売るのに良い仕事をしています。しかし、それはただテンプレートを作成しているように見えます。私が欲しいものにはそれで十分ですか？

口ひげ：

このオプションにはPythonとJSの両方の実装があり、人気があるようです...しかし、DjangoでMustacheテンプレートを使用しているように見える人は見つかりません。それは、ブログ投稿に値するのは簡単すぎるからですか、それとも不可能であるか、そうでなければお勧めできませんか？また、かなり制限されています。少なくとも、ある種のMVCJSフレームワークに目を向ける必要があるでしょう。

バックボーン、スパイン、KnockoutJS、EmberJS、JavascriptMVCなど：

非常に多くのフレームワークがあり、それは一種の気が遠くなるようなものです。それらのすべては一見完全に良いように見えます。また、このルートに行った場合、アプリの多くを書き直す必要があるようです。実際にこのようなことをすでに行っている人を本当に見つけたいと思います。また、Djangoから来た人を背景として明確な選択肢があればいいのにと思います。それらを評価するために、半ダースの異なるフレームワークを学ぶ必要はありません。

DerbyJS

これは、クライアント側とサーバー側の両方を1つのパッケージで処理するため、面白そうに見えますが、少し未成熟です。彼らは本番環境でそれを使用することに対して警告します、そして私がドキュメントを理解するならば、それはまだどんな形の永続性もサポートしていません、それは...制限しています。完成すれば自分の欲しいものにピッタリな気がしますが…

それで....

だから、ええと...今何？誰かがこれらのツールのいずれかを使用して、クライアント側のレンダリングをDjango Webアプリに追加しようとしたことがありますか？どうだった？

最近、knockoutjs や backbone などの JavaScript テンプレート エンジンについてよく耳にします。それらはすべて非常にクールに見えますが、そのようなシステムを使用すると Web ページの適切なインデックス作成が妨げられるのではないかと考えていました。

検索エンジンのクローラーは JavaScript データを解析できますか? これらのクローラーの一部では解析されないため、ページのコンテンツを JavaScript に入れるのは悪い習慣だと思いました。

Django テンプレートの辞書表現を取得する方法はありますか? たとえば、次のテンプレートを使用します。

私はこのようなものになってしまいます：

私は最終結果に非常に柔軟です。私が探しているのは、比較的簡単にJSONにシリアル化できるものを取得して、従来のDjangoの方法でサーバー側でレンダリングするか、クライアントに送信してそこにレンダリングされます。

Django には、cycle というテンプレート タグがあります: https://docs.djangoproject.com/en/2.2/ref/templates/builtins/#cycle

例：

出力：

このタイプの機能を Handlebars.js にどのように実装しますか?

Play for ModelとControllerを使用してアプリケーションを構築していますが、backbone.jsとクライアント側のテンプレートを使用しています。ここで、バッキングコントローラーなしでHTMLテンプレートをPlayで提供したいと思います。テンプレートをパブリックディレクトリに配置できることはわかっていますが、メッセージファイルからテンプレートに文字列を配置するためにPlayのテンプレートエンジンを使用したいと思います。他のデータは必要ないので、テンプレートごとにダミーのコントローラーを作成する手間をかけたくありません。Playでこれを行うことはできますか？