jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
Testing the relative speed of JavaScript template solutions. Feel free to add more!
<script type="text/html" id="smpl_tmpl">
Hello, <%=name%>
</script>
<script type="text/html" id="inner_tmpl">
Life is but a <%=dream%>
</script>
<script type="text/html" id="outer_tmpl">
How about this for a song? <%=inner%>
</script>
<script>
/* Simple HTML templates in pure JavaScript
Andrew Hedges, andrew@hedges.name
http://andrew.hedges.name/
http://snipt.org/rpp
Usage:
var myTemplate = new Template('#{greeting}, #{name}!')
var myOutput = myTemplate.evaluate({
greeting : 'Hello',
name : 'world',
})
alert(myOutput) // "Hello, world!"
*/
function Template(str) {
this.rgx = /#\{([^{}]*)\}/g;
this.str = str || '';
}
// END: Template constructor
Template.prototype.evaluate = function(vals) {
var repr;
vals = vals || {};
repr = function(str, match) {
return 'string' === typeof vals[match] || 'number' === typeof vals[match] ? vals[match] : str;
};
return this.str.replace(this.rgx, repr);
};
// END: Template.prototype.evaluate
var smpl_tmpls = {
simple: new Template('Hello, #{name}!'),
inner: new Template('Life is but a #{dream}'),
outer: new Template('How about this for a song? #{inner}')
};
// Simple JavaScript Templating
// John Resig - http://ejohn.org/ - MIT Licensed
(function() {
var cache = {};
this.tmpl = function tmpl(str, data) {
// Figure out if we're getting a template, or if we need to
// load the template - and be sure to cache the result.
var fn = !/\W/.test(str) ? cache[str] = cache[str] || tmpl(document.getElementById(str).innerHTML) :
// Generate a reusable function that will serve as a template
// generator (and which will be cached).
new Function("obj", "var p=[],print=function(){p.push.apply(p,arguments);};" +
// Introduce the data as local variables using with(){}
"with(obj){p.push('" +
// Convert the template into pure JavaScript
str.replace(/[\r\t\n]/g, " ").split("<%").join("\t").replace(/((^|%>)[^\t]*)'/g, "$1\r").replace(/\t=(.*?)%>/g, "',$1,'").split("\t").join("');").split("%>").join("p.push('").split("\r").join("\\'") + "');}return p.join('');");
// Provide some basic currying to the user
return data ? fn(data) : fn;
};
})();
/*************
Weiss I Nicht's Compiled Templating Solution
Instead of parsing the template at runtime, the template is parsed once
at build time on the serverside. The compiled javascript is optimized
for speed and has very little overhead.
URL: http://github.com/comolongo/Yz-Javascript-Django-Template-Compiler
**************/
var yzHelloTpl = function(name) {
return 'Hello' + name
}
var yzDreamTpl = function(dream) {
return 'Life is but a' + dream
}
var yzSongTpl = function(dream) {
return 'How about this for a song?' + yzDreamTpl(dream)
}
</script>
Ready to run.
Test | Ops/sec | |
---|---|---|
Hedges' Simple Templates |
| ready |
Resig's Micro Templating |
| ready |
Weiss I. Nichts's Compiled Templating |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.