Fasty v1.0.4 发布，一个极快的 JavaScript 模板引擎

Fasty 一个极快的 JavaScript 模板引擎

Fasty 是一个简约、超快的 JavaScript 模板引擎， 它使用了非常独特的缓存技术，从而获得接近 JavaScript 极限的运行性能，并且同时支持 NodeJS 和浏览器。

Fasty 的渲染速度，超过很多市面上的 JavaScript 引擎 100 倍以上。

 

使用方法

示例1

 var template = '<div> hello {{ name }} </div>' var data = {name: "fasty"}  var fasty = new Fasty(); var result = fasty.render(template,data); // result: <div> hello fasty </div>

 

示例2

 var template = ' {{attr}} hello {{ func1(name) }} ---' var data = {name: "fasty"}  var fasty = new Fasty({     //共享的模板数据 或者 方法     share : {         attr:'text...',                  //定义了模板共享方法，因此在 {{...}} 中可以直接使用         func1: function (v){             return v + " kiss~~"         },     } });  var result = fasty.render(template,data); // result: text... hello fasty kiss~~

 

Fasty 语法

输出

 // #1 变量 {{~ var x = 100}} {{x}} //输出: 100   // #2 字符串 {{"hello world"}} //输出：hello world   // #3 计算输出 {{1+2+3}} //输出:6 {{100 / 100}} //输出:1 {{10 % 3 * 100}} //输出:100   // #4 安全输出，对 html 进行 escape {{! "<div> hello world </div>"}} //输出：&lt;div&gt; hello world &lt;/div&gt;   // #5 强制转换 html 输出 {{@ "&lt;div&gt; hello world &lt;/div&gt;"}} //输出：<div> hello world </div>

 

变量定义

 // #1 {{~ var a =100}}  // #2 {{~ var a =100,b = 200,c=300}}  // #3 {{~ let a =100}}  // #4 {{~ let a =100,b=200,c=300}}  // #5 {{~ const a =100}}  // #6 {{~ const a =100,b=200,c=300}}

 

if-else

 // #1 {{~ if (x == 100) }}  {{~ elseif(x == 200) }}  {{~ else if(x == 300) }}  {{~ else }}  {{~ end }}   // #2 {{~ if (x == 200) }} output.... {{~ /if}}

 

• 同时支持 'elseif' 和 'else if'
• if 结尾支持使用 {{~end}} 和 {{~ /if}}

for 循环

 // #1 {{~ for (item of array) }}  {{~end}}  // #2 {{~ for (item in array) }}  {{~end}}  // #3 {{~ for (let item of array) }}  {{~end}}  // #4 {{~ for (const item in array) }}  {{~end}}  // #5 {{~ for (key of Object.keys(item) )}}  {{~end}}  // #6 {{~ for (var x = i;x < 100;x++) }}  {{~ end }}  // #7 {{~ for (item of someMethodInvoke().other()) }}  {{~end}}  // #8 {{~ for (var x = i;x < someMethodInvoke().other();x++) }}  {{~ end }}

 

• for 循环结尾支持使用 {{~end}} 和 {{~ /for}}

安全访问

 // #1 {{a?.b?.c}}  // #2 {{a.bbbb?().ccc?.ddd}}

 

递归调用

 var template1 = '{{~for (item of items)}} {{ myRender(item)}} {{~end}}'; var template2 = '{{~for (item of childItems)}} {{ myRender(item)}} {{~end}}'; var fasty = new Fasty({     share : {         //自定义你的递归渲染方法         myRender:function (data){             return fast.render(data,template2)         },     } });  var data = {   items: [     {       otherAttr: "value1",       childItems: [         {           otherAttr: "value1",           childItems: [],         },         {           otherAttr: "value1",           childItems: [],         },       ],     },     {       otherAttr: "value1",       childItems: [         {           otherAttr: "value1",           childItems: [],         },         {           otherAttr: "value1",           childItems: [],         },       ],     },   ], }; fast.render(data,template1);

 

初始化配置

 var options = {     //共享模板方法和数据     share : {         attr:'text...',         func1:function (v){             return v + " kiss~~"         },     },     // 是否是共享数据优先     // 默认 false，即： render 方法传入的 data 数据优先     shareDataFirst: false, //default is false          //是否开启安全访问，这个功能不支持 IE 浏览器     //IE 下需要设置为 false，同时配置 false 后会得到更高的运行性能     safelyAccess: true,      //是否支持直接使用 window 对象，默认值为：false     windowObjectEnable: false,      //支持使用哪些 window 对象，数据类型为数组     //例如： ['$','JQeury']     windowObjects: null,      //自定义 html 安全输出方法     //当使用 {{* ... }} 的时候使用该方法转换     $escape:function (html){return html},      //自定义 unescape 方法     //当使用 {{! ... }} 的时候使用该方法转换     $unescape:function (value){return value} }  var fasty = new Fasty(options); fast.render(template,data)