模板引擎
模板引擎 起到 數據和視圖分離的作用， 模板對應視圖， 關注如何展示數據， 在模板外頭准備的數據， 關注那些數據可以被展示。
后端模板引擎
freemarker
如下介紹， java后台的模板引擎， freemark介紹，其圖能很好標明這種關系。
Apache FreeMarker is a template engine: a Java library to generate text output (HTML web pages, e-mails, configuration files, source code, etc.) based on templates and changing data. Templates are written in the FreeMarker Template Language (FTL), which is a simple, specialized language (not a full-blown programming language like PHP). You meant to prepare the data to display in a real programming language, like issue database queries and do business calculations, and then the template displays that already prepared data. In the template you are focusing on how to present the data, and outside the template you are focusing on what data to present.
velocity
另外一個 java模板引擎， velocity：
velocity是一個基於java的模板引擎， 它允許任何人使用簡單但是強大的 模板語言， 引用 java代碼中的對象。
Velocity is a Java-based template engine. It permits anyone to use a simple yet powerful template language to reference objects defined in Java code.
按照MVC的思想分離任務， web頁面開發者關注如何將頁面做的好看， 業務開發者關注寫首要的邏輯代碼。
其對 JSP代碼是一種取代。
When Velocity is used for web development, Web designers can work in parallel with Java programmers to develop web sites according to the Model-View-Controller (MVC) model, meaning that web page designers can focus solely on creating a site that looks good, and programmers can focus solely on writing top-notch code. Velocity separates Java code from the web pages, making the web site more maintainable over its lifespan and providing a viable alternative to Java Server Pages (JSPs) or PHP.
不僅僅可以做HTML模板， 也可以做XML和sql其它重復性代碼生成工具。
Velocity's capabilities reach well beyond the realm of the web; for example, it can be used to generate SQL, PostScript and XML from templates.
前端模板引擎
隨着前端技術發展， 和前端處理能力增強， 越來越多的 渲染邏輯在瀏覽器端實現， 由此出現前端模板引擎， 仿照后台模板引擎方法， 定義前端模板語言， 實現前端模板引擎。
arttemplate
https://github.com/aui/artTemplate
新一代 javascript 模板引擎
編寫模板
使用一個
type="text/html"的script標簽存放模板：<script id="test" type="text/html"> <h1>{{title}}</h1> <ul> {{each list as value i}} <li>索引 {{i + 1}} ：{{value}}</li> {{/each}} </ul> </script>渲染模板
var data = { title: '標簽', list: ['文藝', '博客', '攝影', '電影', '民謠', '旅行', '吉他'] }; var html = template('test', data); document.getElementById('content').innerHTML = html;
示例： http://aui.github.io/artTemplate/demo/basic.html
arttemplate 性能介紹
artTemplate 介紹
artTemplate 是新一代 javascript 模板引擎，它采用預編譯方式讓性能有了質的飛躍，並且充分利用 javascript 引擎特性，使得其性能無論在前端還是后端都有極其出色的表現。在 chrome 下渲染效率測試中分別是知名引擎 Mustache 與 micro tmpl 的 25 、 32 倍。
art-template結合tomjs編譯工具效果更佳
https://github.com/aui/tmodjs/
如果在頁面中維護很多 <script>模板端段， 則會很龐大， 且解析效率不佳：
此工具允許各個模板獨自文件管理， 然后精怪此工具合並壓縮， 成為一個可引用的模板文件：
使用默認的格式
TmodJS 默認將整個目錄的模板壓縮打包到一個名為 template.js 的腳本中，可直接在頁面中使用它：
<script src="tpl/build/template.js"></script> <script> var html = template('news/list', _list); document.getElementById('list').innerHTML = html; </script>template.js 還支持 RequireJS、SeaJS、NodeJS 加載。示例
指定格式（amd / cmd / commonjs)
此時每個模板就是一個單獨的模塊，無需引用 template.js：
var render = require('./tpl/build/news/list'); var html = render(_list);
jquery template模板引擎
http://www.cnblogs.com/FoundationSoft/archive/2010/05/19/1739257.html
http://www.cnblogs.com/whitewolf/archive/2011/10/09/2204185.html
https://github.com/BorisMoore/jquery-tmpl
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script> </head> <body> <ul id="movieList"></ul> <script> var movies = [ { Name: "The Red Violin", ReleaseYear: "1998" }, { Name: "Eyes Wide Shut", ReleaseYear: "1999" }, { Name: "The Inheritance", ReleaseYear: "1976" } ]; var markup = "<li><b>${Name}</b> (${ReleaseYear})</li>"; /* Compile the markup as a named template */ $.template( "movieTemplate", markup ); /* Render the template with the movies data and insert the rendered HTML under the "movieList" element */ $.tmpl( "movieTemplate", movies ) .appendTo( "#movieList" ); </script> </body> </html>