artTemplate自動化コンパイルのtmod
3418 ワード
一、背景
フロントエンドのシロの成長過程は、htmlテンプレートのいくつかの問題を経験するのが一般的で、jquery template/artTemplate/yayaTemplateなどのよく見られるテンプレートの使用については、ここでは紹介しません.
まず、なぜテンプレートを使用するのかについてお話しします.
htmlページに重複が多く、煩雑で、論理的で、規則的である場合、テンプレートツールを選択して開発を支援します.開発効率を向上させるだけでなく、コードの読み取り性を組織するのに役立ちます.これは利点であり、私たちがそれを選んだ理由かもしれません.
もちろん避けられない欠点もあります.例えば、
1.SEOの最適化方法△この問題は今日議論した内容ではないので、しばらく議論しないで、興味のある人は伝言を残して共同で検討することができます.
2.どのように集中管理しますか.
どのように集中管理しますか?これはどういう意味ですか.皆さんのテンプレートはこのように使われていると信じています.
はい、上の偽のコードをあげました.あなたはまだこのような方法に従って、あなたのコードを書いていると思いますか?もちろん、このようなコードは正しいので、大きな問題はありません.しかし、フロントエンドの自動化や、フロントエンドのモジュール化がブームになっている今、上のコードは少しlowかもしれません.
1.各ページにテンプレートクライアント解析があり、性能が多かれ少なかれ一定の問題がある.
2.htmlページごとに多くのテンプレートがあり、管理が面倒で、可読性が悪い.
だから.......何を考えたの?
テンプレートコードを1つのファイルに保存しますか?それともそれぞれ個別のファイルですか?Bingo!!!
前のbackbone+Marionette+typescriptのプロジェクトでは、フレームワークは私が組んだものではありません.(このフレームワークを見てC#の城を攻めるライオンが乗っていることを知っていると信じています.弱いタイプの柔軟なjavascriptを、tsで管理する強いタイプの言語に変えたからです.もちろん、
TSが悪いというわけではありませんが、ts管理の先端工程を通じて、メンテナンスはパッケージにしても多重にしても便利です(実は私は簡単だとは思いませんが、ほほほ)、余談です)このプロジェクトのテンプレート用のdustテンプレートは、開発者が接触したことがあるかもしれませんが、このテンプレートの原理は、簡単に言えば:
テンプレートファイルは1つのテンプレートディレクトリに個別に保存され、パブリッシュ時にテンプレートエンジン(nodeまたは他の手段)でjsファイルにコンパイルされ、ページがこのコンパイルされたファイルを参照すれば対応するテンプレートが得られます.
しかし......私たちが今日話したのもdustテンプレートではありません!(ブロガーの話はくどくどしているが,気にしないでください)
以前、nodeプログラムでjqueryTemplateのテンプレートをコンパイルしてみましたが、もちろん、私が言ったテンプレートも単独で管理されています.そして、私が選んだテンプレートはhtml形式です.これはエディタのEmmett構文で叩くのが速いからです.この时、自分でnodeでテンプレートのhtmlファイルをパッケージ化して、それから解析しなければなりません.成功しましたが、面倒で、性能もよくありません.jqueryTemplateを選んだのは、ブロガーが本当に便利だと思っているからです.さまざまなネスト、さまざまな論理、さまざまなカスタムjsコールバックをサポートしています.どうせあなたのさまざまな変態ニーズを満たすことができます.しかし、現在のテンプレートパッケージツールが発見されました.テンセントがartTemplateに対して、つまりtmod(ここは今日のものです.
本題です)、最も残念なことにjqueryTemplateのパッケージコンパイルに関するツールが見つからなかったので、開発には少し制限がありました.
二、artTemplate
時間が限られているので、明日また来ます...
フロントエンドのシロの成長過程は、htmlテンプレートのいくつかの問題を経験するのが一般的で、jquery template/artTemplate/yayaTemplateなどのよく見られるテンプレートの使用については、ここでは紹介しません.
まず、なぜテンプレートを使用するのかについてお話しします.
htmlページに重複が多く、煩雑で、論理的で、規則的である場合、テンプレートツールを選択して開発を支援します.開発効率を向上させるだけでなく、コードの読み取り性を組織するのに役立ちます.これは利点であり、私たちがそれを選んだ理由かもしれません.
もちろん避けられない欠点もあります.例えば、
1.SEOの最適化方法△この問題は今日議論した内容ではないので、しばらく議論しないで、興味のある人は伝言を残して共同で検討することができます.
2.どのように集中管理しますか.
どのように集中管理しますか?これはどういう意味ですか.皆さんのテンプレートはこのように使われていると信じています.
html:
<div id="content1"></div>
<div id="content2"></div>
<div id="content3"></div>
...
<script id="XXXtmpl1" type="text/XXXtempate">
// 1
</script>
<script id="XXXtmpl2" type="text/XXXtempate">
// 2
</script>
<script id="XXXtmpl3" type="text/XXXtempate">
// 3
</script>
...
javascirpt:
$('#content1').html($("#XXXtmpl").template);
$('#content1').html($("#XXXtmpl").template);
$('#content1').html($("#XXXtmpl").template);
...
// , ,
はい、上の偽のコードをあげました.あなたはまだこのような方法に従って、あなたのコードを書いていると思いますか?もちろん、このようなコードは正しいので、大きな問題はありません.しかし、フロントエンドの自動化や、フロントエンドのモジュール化がブームになっている今、上のコードは少しlowかもしれません.
1.各ページにテンプレートクライアント解析があり、性能が多かれ少なかれ一定の問題がある.
2.htmlページごとに多くのテンプレートがあり、管理が面倒で、可読性が悪い.
だから.......何を考えたの?
テンプレートコードを1つのファイルに保存しますか?それともそれぞれ個別のファイルですか?Bingo!!!
前のbackbone+Marionette+typescriptのプロジェクトでは、フレームワークは私が組んだものではありません.(このフレームワークを見てC#の城を攻めるライオンが乗っていることを知っていると信じています.弱いタイプの柔軟なjavascriptを、tsで管理する強いタイプの言語に変えたからです.もちろん、
TSが悪いというわけではありませんが、ts管理の先端工程を通じて、メンテナンスはパッケージにしても多重にしても便利です(実は私は簡単だとは思いませんが、ほほほ)、余談です)このプロジェクトのテンプレート用のdustテンプレートは、開発者が接触したことがあるかもしれませんが、このテンプレートの原理は、簡単に言えば:
テンプレートファイルは1つのテンプレートディレクトリに個別に保存され、パブリッシュ時にテンプレートエンジン(nodeまたは他の手段)でjsファイルにコンパイルされ、ページがこのコンパイルされたファイルを参照すれば対応するテンプレートが得られます.
しかし......私たちが今日話したのもdustテンプレートではありません!(ブロガーの話はくどくどしているが,気にしないでください)
以前、nodeプログラムでjqueryTemplateのテンプレートをコンパイルしてみましたが、もちろん、私が言ったテンプレートも単独で管理されています.そして、私が選んだテンプレートはhtml形式です.これはエディタのEmmett構文で叩くのが速いからです.この时、自分でnodeでテンプレートのhtmlファイルをパッケージ化して、それから解析しなければなりません.成功しましたが、面倒で、性能もよくありません.jqueryTemplateを選んだのは、ブロガーが本当に便利だと思っているからです.さまざまなネスト、さまざまな論理、さまざまなカスタムjsコールバックをサポートしています.どうせあなたのさまざまな変態ニーズを満たすことができます.しかし、現在のテンプレートパッケージツールが発見されました.テンセントがartTemplateに対して、つまりtmod(ここは今日のものです.
本題です)、最も残念なことにjqueryTemplateのパッケージコンパイルに関するツールが見つからなかったので、開発には少し制限がありました.
二、artTemplate
時間が限られているので、明日また来ます...