php模板编译技术,模板预编译技术

介绍

预编译 的使用场景在于，一些文本转换或格式化，通常模板固定，数据动态变化的情况。通过预编译技术，将重复使用的模板预先编译，避免了实时编译转换，以达到提升性能的目的。

下文将介绍 预编译技术 的相关知识：

内部原理

简单实现

相关实践

内部原理

预编译的结果，得到的是对模板进行词法分析而得到的一系列标记 (tokens)。对数据进行渲染 (执行 render 函数)时，其实是通过遍历 tokens 再组合数据，生成结果。

即：

Compile: template => tokens

Render: tokens + data => result string

简单实现

function parse(templ) {

var tokens = [];

var maxTime = Date.now() + 10;

while (templ) {

if (templ.indexOf("{") === 0) {

var index = templ.indexOf("}");

tokens.push({

type: "variable",

name: templ.slice(1, index)

});

templ = templ.substring(index + 1);

continue;

}

var index = templ.indexOf("{");

var text = index < 0 ? templ : templ.substring(0, index);

templ = index < 0 ? "" : templ.substring(index);

tokens.push({

type: "text",

value: text

});

if (Date.now() >= maxTime) break;

}

return tokens;

}

function compile(tokens, data) {

var str = '';

for (var i = 0; i < tokens.length; i++) {

var token = tokens[i];

switch (token.type) {

case "text":

str += token.value;

break;

case "variable":

str += data[token.name];

break;

default:

break;

}

}

return str;

}

var preCompile = function (template) {

var tokens = parse(template);

return {

render: function (data) {

return compile(tokens, data);

}

};

};

var template = preCompile("I am {name} i'm {age} years old!");

console.log(template.render({ name: "Sam", age: 22 }));

console.log(template.render({ name: "Jack", age: 23 }));

相关实践

模板引擎

时间格式化 tiny-time (https://github.com/aweary/tinytime)

Css Selector css-what (https://github.com/fb55/css-select)