は、バックエンドとフロントエンドのテンプレートに同じtwig構文を使用しています

最近、クライアント側のテンプレート用のTwigと同じ構文のテンプレートシステムと、Twigとの統合について考えています。 "Swigを見つけました。これは、" javigriptのための枝 "と思われます。は、バックエンドとフロントエンドのテンプレートに同じtwig構文を使用しています

さらに別の構文を習得する必要はありません、
ポータブルテンプレート：いくつかの利点を持っている可能性があり、同じ構文を使用して

は同じブロックには、フロントエンドおよび/またはバックエンドのテンプレートの両方に使用に依存することができ建築。
あなたはしかし、いくつかの課題が生じるであろう...

をそれに名前を付ける：

を、私は、テンプレート内のタグ/ブロック/部品は、構文解析をフロントエンドに専用されているかを定義するためのメカニズムが必要になります。 {% raw %}タグはその仕事をしますが、...
は、移植可能なテンプレートを目指して、非常にきめ細かなブロックと "生のままにする"可能性を示します。例：私はメインのHTMLファイルの<head>を収集したいと思います。フロントエンドのテンプレートエンジンで利用できるようにしたいブロックはすべて、<script>タグで囲まれています。だから私はこれらのブロックを「生かす」必要があります。

Swigや他のJavaScriptテンプレートシステムと一緒にTwigを使用した人はいますか？Twigの構文と多少衝突する構文ですか？どのようにテンプレートを管理/整理して、テンプレートを/フロントエンドでも簡単に使用できるようにしますか？

出典

2012-04-20 Benoît Pointet

私はあなたが参照するswigは、他の質問のほとんどがswigとタグ付けされたものと同じswigではないと思うか、それについてタグwikiが何を記述しているのでしょうか？ – Flexo

あなたが望む正確な目的ではありませんが、[twig.js]（https://github.com/schmittjoh/twig.js）をチェックしてください。 – Maerlyn

@マールリンありがとうございます。 –

免責事項：これは未解決の質問に対する公開された回答です。にご注意ください。私はこの質問に答える簡単で単一な方法がないので、私の経験を共有しています。

私は、symfonyの皆さんと緊密に協力しているフロントエンドのWeb開発者です。今日は、小枝とひげそりのテンプレートを一緒に使用しました。口癖のテンプレートは、どこにajax呼び出しが必要なのかを問わず、duplictad twigを作成します。明らかに、これは巨大な保守オーバーヘッドでした。

2つの別々の問題に対処するために私の回答を2つの部分に分けました。それらを簡単にフロントエンドにするためのテンプレートの構築、およびtwigのjavascript実装の追加が含まれます。

テンプレート構造

我々は、論理的に整理するテンプレートの方に取った最初のステップは、ページレベル、機能とプレゼンテーションテンプレートにそれらを分割しました。

Page Levelテンプレートは、アプリコンテンツの一般的なコンテナを定義するテンプレートです。だと思うの：

ユーザーの不正
ユーザーが
メールを許可

機能テンプレートはただ一歩深いです。それらはページ全体を構築するために使用されるプレハブです。通常、バックエンドからのデータが格納されるポイントです。たとえば、コンテナ内のユーザーのリストを考えてみましょう。機能テンプレートは、プレゼンテーションテンプレートを含むコンテナで、データを渡します。

プレゼンテーションテンプレートはロジックなし（データ変換なし）のコンポーネントであり、データが供給されます。このコンポーネントはネストできます。（例えば、ボタンおよびタイトルはともにCTA成分によって含まれる）。プレゼンテーションコンポーネントは、私たちのビルディングブロックの中でも最も優れたものです。

このようにコードを整理するのには時間がかかりましたが、フロントエンドでレンダリング可能でなければならないコンポーネントと論理的に重くなるコンポーネントを明確に区別することができました。

twig.js Twig.js（コメントのいずれかに示唆されるように）次のステップは、統合された

。

私はメインのHTMLファイルの中で、フロントエンドのテンプレートエンジンで利用可能にしたいブロックをそれぞれ1つのタグにまとめました。だから私はこれらのブロックを「生かす」必要があります。

twig.jsを使用すると、フロントエンドでテンプレートを利用できるようにする心配はありません。 URLを提供するだけで、テンプレートが他のテンプレートを拡張または含む場合、非同期でロードされます。だから、jsonデータを与えられた小枝テンプレートは、javascriptでレンダリングされ、追加のテンプレートエンジンは必要ありません。

パフォーマンステストは一度も実行していません。 twig.jsは口ひげよりもかなり遅いと想像できるが、twig.jsのロジックレスコンポーネントだけをレンダリングすると、パフォーマンスが大幅に向上する可能性がある。

私が何も言及していない場合は、私に知らせてください。私はこのテーマについてさらに議論したいと思っています。

出典

2017-11-30 19:32:23 entio

は、バックエンドとフロントエンドのテンプレートに同じtwig構文を使用しています

答えて

関連する問題