常用的JavaScript模板引擎介绍
最近工作内容慢慢接近我的理想化（web前端），所以关注比较多的是前端性能！后台同事介绍使用ajax模板引擎，提高渲染速度！
下面介绍几款 JavaScript 模板引擎
1. Mustache
基于javascript 实现的模板引擎,类似于 Microsoft's jQuery template plugin,但更简单易用!
2. doT.js
doT.js 包含为浏览器和Node.js 准备的 JavaScript 模板引擎。
3. jSmart
jSmart 是著名的 PHP 模板引擎 Smarty 的 JavaScript 移植版本。
4. dom.js
dom.js 是一款可用在客户端和服务器端的 JavaScript 模板引擎
5. jade
Jade是受Haml的影响以JavaScript实现用于node的高性能模板引擎。
6. Hogan.js
来自 Twitter 的 JavaScript 模板引擎。
7. Handlebars
Handlebars 是一个 JavaScript 的页面模板库
8. artTemplate
artTemplate 是新一代 javascript 模板引擎，它在 v8 中的渲染效率可接近 javascript 性能极限，在 chrome 下渲染效率测试中分别是知名引擎 Mustache 与 micro tmpl 的 25 、 32 倍。引擎支持调试。若渲染中遇到错误，调试器可精确定位到产生异常的模板语句，解决前端模板难以调试的问题。
独有模板编译工具，它能把前端模板编译成不依赖模板引擎运行的JS文件，让前端模板可以突破浏览器的限制，实现像后端模板一样按文件与目录的方式组织、按需加载、include嵌套等。这一切都在 2kb(gzip) 中实现！
也许你会觉得这个插件名似曾相识，没错！这个也是artDialog的作者糖饼
博客地址：http://www.planeart.cn/
引用引擎
<script src="js/template.js"></script>
编写模板
<script id="test" type="text/html">
//使用一个type="text/html"的script标签存放模板：
<h1><%=title%></h1>
<ul>
<%
for(i=0;i<list.length;i++){%>
<li>itemL <%=i+1%>:<%=list[i]%></li>
<%}%>
</ul>
//模板逻辑语法开始与结束的界定符号为<% 与%>，若<%后面紧跟=号则输出变量内容
</script>
渲染模板
var data = {
title: '标签',
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
};
var html=template.render("test",data);
document.getElementById('content').innerHTML = html;
相关文章
这篇文章主要介绍关于导出Excel通用方法的实用前端技巧,希望能够帮助大家更好地处理数据导出需求,接下来,我将为大家详细介绍这个方法和代码实现,需要的朋友可以参考下2023-09-09
这篇文章主要来和大家分享一下15个用于开发的TypeScript高级技巧，文中的示例代码讲解详细，具有一定的学习价值，感兴趣的小伙伴可以了解一下2023-07-07
本文主要介绍了js实现简易垂直滚动条的示例代码，具有很好的参考价值，下面跟着小编一起来看下吧2017-02-02
这篇文章主要详细介绍了vue 自定义指令directive的使用场景，文中有详细的代码示例，感兴趣的小伙伴欢迎阅读2023-04-04
这篇文章主要介绍了JS实现淡入淡出图片效果的方法,结合实例形式分析了js鼠标响应实现图片淡入淡出效果的原理与相关实现技巧,需要的朋友可以参考下2016-12-12
如果网页不是通过脚本程序打开的（window.open()），调用window.close()脚本关闭窗口前，必须先将window.opener对象置为null，否则浏览器（IE7、IE8）会弹出一个确定关闭的对话框。2010-01-01
用JS实现网页元素阴影效果的研究总结...2007-08-08
scroll事件实现监控滚动条并分页显示(zepto.js)
这篇文章主要为大家详细介绍了scroll事件实现监控滚动条并分页显示示例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
很多人会把微信小程序的登录和授权搞混淆,下面这篇文章主要给大家介绍了如何通过大白话理解微信小程序授权登录的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-12-12
这篇文章主要给大家介绍了关于微信小程序实现2048小游戏的相关资料,文中将实现的代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友可以参考下2021-09-09
最新评论