如何选择Javascript模板引擎(javascript template engine)?

标签: 选择 javascript 模板引擎 | 发表时间:2012-09-17 17:27 | 作者:jjfat
出处:http://www.yeeyan.org

译者 jjfat

日期:2012-9-17  来源: GBin1.com

如何选择Javascript模板引擎(javascript template engine)?

随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下:

你的到了一个JSON对象,如下:

var data={
  email: '[email protected],
  gender: 'male'  
}

然后你需要将json数据组织成页面内容,如下:

var email, gender;
email= '<div class="mail">' + data.email+ </div>'; 
gender= '<div class="gender">' + data.gender + </div>'; 
$('#contentwrapper‘).append(content).append(gender);

代码执行功能非常简单,将json数据生成web页面中的内容,如下:

<div class="mail">[email protected]</div>
<div class="gender">Male</div>

如果只是简单代码组合可能还好一些,但是如果页面大量使用类似的结构的话,除非一直是同一个程序员维护,否则后期的管理成本会相对非常的高。

为 了解决这个问题, 我们通常会引入"javascript模板引擎概念“,提到模板,相信大家都不会陌生,如果你开发过服务器端程序,例如J2EE相关技术的话,肯定对于 Freemarker,sitemesh等模板类库非常熟悉,它能够有效的帮助你组织和维护代码结构,提高代码编写效率和降低维护成本。

目前开源的 javascript模板引擎很多,抛给我们的问题是 - 如何选择一个js模板引擎?

为了更好的帮助大家辅助选择 模板引擎,这里推荐一个不错的工具性网站: Template-engine-chooser

打开这个网站后,我们可以看到列出了比较常用的js模板引擎,例如,mustache.js,jQuery之父John 的micorotemplate.js,还有jQuery Tmpl的替代品 - jsrender等等。

在类库列表的左边是一系列的问题,如下:

  • 模板需要在客户端使用还是服务器端?
  • 逻辑复杂程度有多少?
  • 是不是有运行速度要求?
  • 是不是需要预定义的模板?
  • 需要Partials支持吗?
  • 需要DOM结构或者String字符串类型?
  • 除了模板标签,是不是在渲染前后开发语言一致?

如果你也在寻找js模板的话,你肯定也有一些问题,或者就是上面列出的问题里。你只需要针对不同的问题回答:是或者不是,这个工具会自动选择合适的模板。

当然,这里的模板并不是很全,但是包含了比较知名的模板,希望以后它能够添加更多模板选择项。

希望大家喜欢这个工具!如果你有任何问题,请给我们留言!

来源: 如何选择Javascript模板引擎(javascript template engine)?

相关 [选择 javascript 模板引擎] 推荐:

如何选择Javascript模板引擎(javascript template engine)?

- - 译言-每日精品译文推荐
日期:2012-9-17  来源: GBin1.com. 随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下:. 你的到了一个JSON对象,如下:. 然后你需要将json数据组织成页面内容,如下:. 代码执行功能非常简单,将json数据生成web页面中的内容,如下:.

Juicer – 一个Javascript模板引擎的实现和优化

- - Taobao UED Team
让我们从一段代码说起,假设有一段这样的JSON数据:. 我们需要根据这段JSON生成这样的HTML代码:. 流火 (blog: ued.taobao.com). 传统的Javascript代码一定是这个样子:. 不言而喻,这样的代码混杂了html结构和代码逻辑,而且代码不具可读性,不便于后期维护,于是便有了这样一个函数:.

高性能JavaScript模板引擎原理解析

- - 腾讯CDC
  随着 web 发展,前端应用变得越来越复杂,基于后端的 javascript(Node.js) 也开始崭露头角,此时 javascript 被寄予了更大的期望,与此同时 javascript MVC 思想也开始流行起来. javascript 模板引擎作为数据与界面分离工作中最重要一环,越来越受开发者关注,近一年来在开源社区中更是百花齐放,在 Twitter、淘宝网、新浪浪微博、腾讯QQ空间、腾讯微博等大型网站中均能看到它们的身影.

调研js模板引擎

- - CSDN博客Web前端推荐文章
从这几个指标来比较js模板引擎:. 1 文件大小 - 影响网络传输时间. 2 执行速度(性能) - 影响响应速度,涉及模板解析和渲染. 3 语法简明/易用/灵活/自定义操作符 - 影响开发效率和维护难度. 4 错误处理/调试 - 影响开发效率和维护难度. 5 安全(XSS) - 是否防止XSS. artTemplate(腾讯):5k.

精心挑选12款优秀的 JavaScript 日历和时间选择插件

- - 博客园_梦想天空
  今天这篇文章向大家分享12款精心挑选的优秀. JavaScript 日历和时间选择插件,都带有详细的使用教程和效果演示. Web 开发人员更快速的实现各种精美的日历和时间选择效果. 同时推荐阅读的博文中还有更多实现各种网站功能的. jQuery 优秀插件,欢迎大家可以去淘金. 精心挑选的优秀jQuery Ajax分页插件和教程.

Javascript诞生记

- Milido - 阮一峰的网络日志
二周前,我谈了一点Javascript的历史. 今天把这部分补全,从历史的角度,说明Javascript到底是如何设计出来的. 只有了解这段历史,才能明白Javascript为什么是现在的样子. 我依据的资料,主要是Brendan Eich的自述. "1994年,网景公司(Netscape)发布了Navigator浏览器0.9版.

JavaScript,你懂的

- dylan - keakon的涂鸦馆
经常有人问我,JavaScript应该怎么学. 先学基本语法,如果曾学过C等语言,应该1小时内就能掌握了. 再去使用内置的函数、方法和DOM API,熟悉它能干什么;而在学习DOM API的过程中,你还不得不与HTML和CSS打交道. 然后弄懂匿名函数和闭包,学会至少一个常用的JavaScript库(例如jQuery).

Javascript 里跑Linux

- rockmaple - Shellex&#39;s Blog
牛逼到暴的大拿 Fabrice Bellard,用Javascript实现了一个x86 PC 模拟器,然后成功在这个模拟器里面跑Linux(请用Firefox 4 / Google Chrome 11打开,Chome 12有BUG). 关于这个东西… 伊说 “I did it for fun“,大大啊大大啊….

高效 JavaScript

- xtps - ITeye论坛最新讨论
传统上,网页中不会有大量的脚本,至少脚本很少会影响网页的性能. 但随着网页越来越像 Web 应用程序,脚本的效率对网页性能影响越来越大. 而且使用 Web 技术开发的应用程序现在越来越多,因此提高脚本的性能变得很重要. 对于桌面应用程序,通常使用编译器将源代码转换为二进制程序. 编译器可以花费大量时间优化最终二进制程序的效率.