`

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

阅读更多

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

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

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

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

var data={
  email: 'terry.li@gbin1.com,
  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">terry.li@gbin1.com</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模版引擎-templateEngine.zip

    在“javascript-高性能javascript模版引擎-templateEngine.zip”这个压缩包中,我们很显然会发现一个关于创建高效JavaScript模板引擎的资源集合。下面我们将详细探讨JavaScript模板引擎的工作原理、优点、常见实现...

    Json+NVelocity模板引擎C#入门示例,比较全面

    在IT领域,Json和NVelocity模板引擎是两个重要的技术组件,尤其在C#开发中有着广泛的应用。Json是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。NVelocity则是一个开源的Java模板引擎,...

    templateEngine.zip

    总结,"templateEngine.zip"包含的内容涵盖了JavaScript模板引擎的各个方面,无论你是初学者还是有一定经验的开发者,都能从中受益。通过深入学习和实践,你将能够熟练掌握模板引擎的运用,提升Web开发效率和代码...

    只有 20 行的 JavaScript 模板引擎实例详解

    在这个只有20行的JavaScript模板引擎实例中,我们将深入理解如何实现这一功能。 首先,模板引擎的核心任务是找到模板字符串中的标识片段,即`&lt;%...%&gt;`,并用提供的数据对象替换这些片段。在给定的代码中,使用了一...

    PHPnow template engine PHP模板引擎 v1.0.zip

    PHPnow Template Engine是一款专为PHP开发设计的模板引擎,它旨在简化HTML与PHP代码的混合,提高代码可读性和维护性。PHPnow引擎允许开发者将业务逻辑与展示逻辑分离,从而使得网页设计师可以独立地修改页面布局,而...

    Javascript模板引擎surge.js.zip

    Surge.js 是新的示例,更快的 Javascript 模板引擎,语法跟 Liquid 和 Django template一样 。Surge.js 会解析 Html 模板中的 JavaScript 函数,编译的函数会被缓存。教程速度测试 V8 Javascript engine 的测试...

    Xmark Template Engine V1.1.0 Beta(一个通用的可扩展标记模板引擎).zip

    总之,Xmark Template Engine V1.1.0 Beta是一个强大且灵活的JavaScript模板引擎,它的可扩展性和性能优化使得它在处理动态HTML生成方面具有很高的价值。通过深入理解和掌握其使用方法,开发者可以更高效地构建动态...

    template-engine:前端JavaScript模板库

    Sameera M制造的前端Javascript模板引擎。 CDN 句法 #{varName} 初始化 let data = { word1 : "Hello" , word2 : "World" } let renderer = new Template ( "html" , data ) renderer . init ( ) 模板化 ...

    Hanjst:Han JavaScript Template Engine 汉吉斯特 JavaScript模板引擎

    韩语JavaScript模板语言和引擎 。 汉是我妻子的姓,也是我女儿和儿子的名字之一。 汉在汉人拼音中也是华人。 :person_raising_hand: Hanjst的目的是为了停止HTML模板引擎的“重新发明轮子”,尽管这听起来很荒谬...

    基于 ES6 的简易服务器端 WEB 模板引擎

    【标题】: "基于 ES6 的简易服务器端 WEB 模板引擎" 在现代 Web 开发中,服务器端渲染模板引擎是构建动态网站的关键组件之一。...在实际开发中,可以根据项目需求选择适合的特性来构建自己的模板引擎。

    JSTE - 基于JavaScript语法的简易模板引擎

    JSTE(JavaScript Syntax Based Template Engine)是一种轻量级的模板引擎,它允许开发者使用JavaScript语法来定义和渲染HTML模板。这种模板引擎的出现,使得前端开发者能够更加灵活地处理动态数据,将数据与视图...

    问沫模板引擎问沫模板引擎

    1. `VMoom.TemplateEngine.dll`:这是一个动态链接库文件,通常包含了问沫模板引擎的实现代码。开发者可以引用这个库来在他们的项目中使用问沫模板引擎的功能。 2. `使用说明.txt`:这应该是问沫模板引擎的使用指南...

    A Template Engine for Modern C++.zip

    在学习和使用"A Template Engine for Modern C++"时,你需要理解模板引擎的底层机制,熟悉其API,并了解如何将它集成到你的C++项目中。同时,了解模板引擎与其他编程语言中的同类工具(如JavaScript的EJS或Ruby的ERB...

    art-template:高性能JavaScript模板引擎

    艺术模板 |art-template是一个简单且超快速的模板引擎,可通过范围内预先声明的技术优化模板渲染速度,从而实现接近JavaScript极限的运行时性能。 同时,它支持NodeJS和浏览器。 。 art-template是一个简约,超快的...

    node-template-literals-engine:一个非常简单的模板文字模板引擎

    JS模板文字引擎 一个非常基本的,直接使用JS模板文字的模板引擎 为什么 (也称为“模板字符串”)是一种运行嵌入表达式和字符串插值的熟悉且易于使用的方法,这是模板引擎的主要功能。 该库使用传统技术(布局,...

    template:轻量级,高性能且运行时的javascript模板引擎

    "template:轻量级,高性能且运行时的javascript模板引擎" 提到了一个JavaScript实现的模板引擎,其特点是轻量、高效并在运行时工作。 **轻量级** 轻量级意味着这个模板引擎的体积小,对项目的影响小,易于集成。在...

    页面开发:图片轮播,js模板引擎,倒计时等功能

    JavaScript模板引擎(JavaScript Template Engine)是将数据和视图分离的一种技术,用于动态生成HTML。它允许开发者预先定义好HTML结构,然后用特定的语法(如Mustache的`{{ }}`,Handlebars的`{{ }}`,EJS的`&lt;% %&gt;`...

    PUG-the-js-template-engine:javascript模板引擎:dog_face:

    PUG-js-模板引擎javascript模板引擎 :dog_face:文件资料[pug.org] (http://www.smartredirect.de/redir/clickGate.php?...

Global site tag (gtag.js) - Google Analytics