xtemplate
Version:
eXtensible Template Engine lib on browser and nodejs. support async control, inheritance, include, logic expression, custom function and more.
229 lines (202 loc) • 8.88 kB
HTML
<h1>xtemplate benchmark</h1>
<div id="log" style="padding:10px;border: 1px solid red;"></div>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/benchmark.js">
</script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/handlebars.js">
</script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/dust-full.js">
</script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/jade.js">
</script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/nunjucks.js">
</script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/visionmedia-ejs.js">
</script>
<script src="//g.alicdn.com/kissy/edge/2014.07.16/seed-debug.js"></script>
<script src="/bower_components/modulex/build/modulex-debug.js"></script>
<script>
modulex.config({
packages: {
xtemplate: {
filter: '',
base: '/lib/xtemplate'
}
}
});
</script>
<script src="views/includes/nunjucks_part.js"></script>
<script>
modulex.use('xtemplate', function (XTemplate) {
KISSY.use(['node', 'io', 'util', 'promise'], function (S, $, io, util, Promise) {
var logEl = $('#log');
var nunjucksEnv = nunjucks.configure('views');
function reverseEach(arr, fn) {
util.each(arr.concat().reverse(), fn);
}
function log(str) {
logEl.append('<p>' + str + '</p>');
}
function benchmark(files, callback) {
var defer = new Promise.Defer();
var all = [];
var ios = {};
var flatFiles = [];
util.each(files, function (fs, type) {
ios[type] = ios[type] || {};
flatFiles.push(fs);
all.push.apply(all, util.map(fs, function (f) {
return io({
url: 'views/' + f + (f.indexOf('.') == -1 ? '.html' : ''),
success: function (data) {
ios[type][f] = data;
}
})
}));
});
var compilers = {};
var data = {
title: 'Demo',
using: true,
lis: [
{
d: 'one'
},
{
d: 'two'
},
{
d: 'three'
}
]
};
log('loading: ' + flatFiles);
Promise.all(all).then(function () {
log('benchmarking: ' + flatFiles);
for (var type in files) {
compilers[type] = {};
}
reverseEach(files.xtpl, function (name) {
var data = ios.xtpl[name];
name = name.slice(0,-5);
compilers.xtpl[name] = new XTemplate(data, {name: name});
console.log(name);
modulex.add(name, function () {
return compilers.xtpl[name].fn;
});
});
reverseEach(files.dust, function (name) {
var data = ios.dust[name];
dust.loadSource(compilers.dust[name] = dust.compile(data, name));
});
if (files.jade) {
reverseEach(files.jade, function (name) {
var data = ios.jade[name];
compilers.jade[name] = jade.compile(data, {filename: name});
});
}
reverseEach(files.nunjucks, function (name) {
var data = ios.nunjucks[name];
compilers.nunjucks[name] = nunjucks.compile(data, nunjucksEnv, name);
});
reverseEach(files.handlebars, function (name) {
var data = ios.handlebars[name];
Handlebars.registerPartial(name, data);
compilers.handlebars[name] = Handlebars.compile(data);
});
if (files.ejs) {
reverseEach(files.ejs, function (name) {
compilers.ejs[name] = ejs.compile(ios.ejs[name], {
filename: name
});
});
}
for (var type in files) {
var name = files[type][0];
if(type==='xtpl'){
name = name.slice(0,-5);
}
compilers[type].main = compilers[type][name];
}
var ret;
ret = compilers.xtpl.main.render(data);
//console.log(ret);
ret = null;
dust.render(files.dust[0], data, function (e, content) {
if (e) {
throw e;
}
ret = content;
});
//console.log(ret);
ret = null;
//ret = compilers.jade.main(data);
ret = null;
ret = compilers.nunjucks.main.render(data);
//console.log(ret);
ret = null;
ret = compilers.handlebars.main(data);
//console.log(ret);
ret = null;
//ret = compilers.ejs.main(data);
var suite = new Benchmark.Suite;
suite.add(files.dust[0], function () {
dust.render(files.dust[0], data, function (e) {
if (e) {
throw e;
}
});
});
if (files.jade) {
suite.add(files.jade[0], function () {
compilers.jade.main(data);
});
}
suite.add(files.nunjucks[0], function () {
compilers.nunjucks.main.render(data);
});
suite.add(files.xtpl[0], function () {
compilers.xtpl.main.render(data);
});
suite.add(files.handlebars[0], function () {
compilers.handlebars.main(data);
});
if (files.ejs) {
suite.add(files.ejs[0], function () {
compilers.ejs.main(data);
});
}
suite.on('cycle', function (event) {
log(String(event.target));
}).on('complete', function () {
defer.resolve(suite);
}).run({ 'async': true });
});
return defer.promise;
}
var files = {
xtpl: ['common/xtpl'],
dust: ['common/dust'],
jade: ['common/jade'],
nunjucks: ['common/nunjucks'],
handlebars: ['common/handlebars'],
ejs: ['common/ejs']
};
var includes = {
// ejs: ['includes/ejs', 'includes/ejs_part'],
xtpl: ['includes/main.xtpl', 'includes/part.xtpl'],
dust: ['includes/dust', 'includes/dust_part'],
// jade: ['includes/jade', 'includes/jade_part'],
nunjucks: ['includes/nunjucks'],
handlebars: ['includes/handlebars', 'includes/handlebars_part']
};
//return benchmark(includes);
log('<span style="font-size: 30px;font-weight: bold;">common benchmark:</span>');
benchmark(files).then(function () {
log('<span style="font-size: 30px;font-weight: bold;">include benchmark:</span>');
return benchmark(includes);
}).then(function () {
log('<span style="font-size: 30px;font-weight: bold;">all is over</span>');
});
});
});
</script>