一日,从CDC上看到一边关于《高性能JavaScript模板引擎原理解析》,初略阅读确定这就是我要的,原因如下:
1、减少服务端压力,虽说现在服务器配置很好,但是对于普通客户而言,配置大量集群,也许会囊中羞涩;而现在用户的电脑配置以及浏览器的JavaScript引擎已经有很大提升尤其是chrome和firefox之类,所以我们可以充分利用终端用户的资源;
2、易维护,在维护代码的时候,我们只需要修改模板文件即可,无需在页面上维护一堆乱糟糟的代码;
3、效率高,相比我们传统意义上的ajax返回数据,然后字符串拼接效率要高很多,例如字符串拼接采用数组的 push 方法以提升在 IE6、7 下的性能;
JavaScript模板引擎很多,出名的有mustache、tmpl、juicer、artTemplate,在经过性能对比测试后选择了使用artTemplate,artTemplate看名字应该猜得出来artDialog的作者,在腾讯的很多项目中使用,品质和性能有保证,并且已经在github上开源。
由于代码我用了两种方式实现,两个版本贴代码也不是很方便,所以把源码也一并上传了,见附件,源码中已经加入了很多注释。
代码使用jQuery实现,一种采用传统的函数模式,一种采用代理绑定事件(由于template的特殊性,需要用到live代理模式,传统的绑定无效),详见代码与注释
新手入门可观看如下官方教程:
再次提出一点,我觉得artTemplate不足的地方,模版中无法支持js原生函数,Math.floor,parseInt等等,不适合编写逻辑复杂代码,可替代方案:在后端处理好简单数据供前端使用,后台处理速度很快的