资讯专栏INFORMATION COLUMN

js模板引擎——art Template

2i18ns / 2250人阅读

摘要:简单介绍模板引擎作为数据与界面分离工作中最重要一环,越来越受开发者关注。是新一代模板引擎,它采用预编译方式让性能有了质的飞跃,并且充分利用引擎特性,使得其性能无论在前端还是后端都有极其出色的表现。

简单介绍

javascript 模板引擎作为数据与界面分离工作中最重要一环,越来越受开发者关注。

artTemplate 是新一代 javascript 模板引擎,它采用预编译方式让性能有了质的飞跃,并且充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现。

javascript 模板引擎基本原理

虽然每个引擎从模板语法、语法解析、变量赋值、字符串拼接的实现方式各有所不同,但关键的渲染原理仍然是动态执行 javascript 字符串。

可看:http://cdc.tencent.com/?p=5723 基本原理的例子

artTemplate 高效的秘密

1、预编译
在一般的模板引擎实现原理中,因为要对模板变量进行赋值,所以每次渲染都需要动态编译 javascript 字符串完成变量赋值。而 artTemplate 的编译赋值过程却是在渲染之前完成的,这种方式称之为“预编译”。

2、更快的字符串相加方式
很多人误以为数组 push 方法拼接字符串会比 += 快,要知道这仅仅是 IE6-8 的浏览器下。实测表明现代浏览器使用 += 会比数组 push 方法快,而在 v8 引擎中,使用 += 方式比数组拼接快 4.7 倍。所以 artTemplate 根据 javascript 引擎特性采用了两种不同的字符串拼接方式。

使用方法

1、引用js文件:
2、页面中,使用一个type="text/template"的script标签存放模板:

                
阅读需要支付1元查看
<