Skip to content

Commit

Permalink
chore: update benchmark page, remove non-embedded template engines
Browse files Browse the repository at this point in the history
  • Loading branch information
@nebrelbug
nebrelbug committed May 29, 2023
1 parent 4fff2b5 commit 8e252a7
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 196 deletions.
4 changes: 2 additions & 2 deletions browser-tests/benchmark.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,15 +103,15 @@
<!-- This is a fallback, since ../dist/browser/eta.min.js is not uploaded to GitHub -->
<script src="https://unpkg.com/eta"></script>
<script src="../dist/browser.min.umd.js"></script>
<script src="https://unpkg.com/squirrelly@8.0.8"></script>
<script src="https://unpkg.com/squirrelly@9.0.0"></script>
<script src="https://unpkg.com/mustache@4.2.0/mustache.min.js"></script>
<script src="https://pugjs.org/js/pug.js"></script>
<script src="https://unpkg.com/swig@1.4.2/dist/swig.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/lodash/lodash.min.js"></script>

<script src="./benchmark.js"></script>
<script>
app("#app");
load("#app");
</script>
</div>
</body>
Expand Down
228 changes: 34 additions & 194 deletions browser-tests/benchmark.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,130 +16,62 @@ The above copyright notice and this permission notice shall be included in all c
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

eta.configure({
const etaInstance = new eta.Eta({
autoTrim: false,
});

Sqrl.defaultConfig.autoTrim = false;

var templateList = {};

templateList["template"] = `
var templateList = {
template: `
<ul>
<% for (var i = 0, l = list.length; i < l; i ++) { %>
<li>User: <%= list[i].user %> / Web Site: <%= list[i].site %></li>
<% } %>
</ul>`;

templateList["template-raw"] = `
</ul>`,
"template-raw": `
<ul>
<% for (var i = 0, l = list.length; i < l; i ++) { %>
<li>User: <%- list[i].user %> / Web Site: <%- list[i].site %></li>
<% } %>
</ul>`;

templateList["template-fast-mode"] = `
</ul>`,
"template-fast-mode": `
<ul>
<% for (var i = 0, l = $data.list.length; i < l; i ++) { %>
<li>User: <%= $data.list[i].user %> / Web Site: <%= $data.list[i].site %></li>
<% } %>
</ul>`;

templateList["template-fast-mode-raw"] = `
</ul>`,
"template-fast-mode-raw": `
<ul>
<% for (var i = 0, l = $data.list.length; i < l; i ++) { %>
<li>User: <%- $data.list[i].user %> / Web Site: <%- $data.list[i].site %></li>
<% } %>
</ul>`;

templateList["eta"] = `
</ul>`,
eta: `
<ul>
<% for (var i = 0, ln = it.list.length; i < ln; i ++) { %>
<li>User: <%= it.list[i].user %> / Web Site: <%= it.list[i].site %></li>
<% } %>
</ul>`;

templateList["pug"] = `
ul
-for (var i = 0, l = list.length; i < l; i ++) {
li User: #{list[i].user} / Web Site: #{list[i].site}
-}`;

templateList["pug-raw"] = `
ul
-for (var i = 0, l = list.length; i < l; i ++) {
li User: !{list[i].user} / Web Site: !{list[i].site}
-}`;

templateList["dot"] = `
</ul>`,
"eta-raw": `
<ul>
<% for (var i = 0, ln = it.list.length; i < ln; i ++) { %>
<li>User: <%~ it.list[i].user %> / Web Site: <%~ it.list[i].site %></li>
<% } %>
</ul>`,
dot: `
<ul>
{{ for (var i = 0, l = it.list.length; i < l; i ++) { }}
<li>User: {{!it.list[i].user}} / Web Site: {{!it.list[i].site}}</li>
{{ } }}
</ul>`;

templateList["dot-raw"] = `
</ul>`,
"dot-raw": `
<ul>
{{ for (var i = 0, l = it.list.length; i < l; i ++) { }}
<li>User: {{=it.list[i].user}} / Web Site: {{=it.list[i].site}}</li>
{{ } }}
</ul>`;

templateList["mustache"] = `
<ul>
{{#list}}
<li>User: {{user}} / Web Site: {{site}}</li>
{{/list}}
</ul>`;

templateList["mustache-raw"] = `
<ul>
{{#list}}
<li>User: {{{user}}} / Web Site: {{{site}}}</li>
{{/list}}
</ul>`;

templateList["handlebars"] = `
<ul>
{{#list}}
<li>User: {{user}} / Web Site: {{site}}</li>
{{/list}}
</ul>`;

templateList["handlebars-raw"] = `
<ul>
{{#list}}
<li>User: {{{user}}} / Web Site: {{{site}}}</li>
{{/list}}
</ul>`;

templateList["squirrelly"] = `
<ul>
{{@each(it.list) => val}}
<li>User: {{val.user}} / Web Site: {{val.site}}</li>
{{/each}}
</ul>`;

templateList["squirrelly-fast"] = `
<ul>
{{! for (var i = 0, l = it.list.length; i < l; i ++) { }}
<li>User: {{it.list[i].user}} / Web Site: {{it.list[i].site}}</li>
{{! } }}
</ul>`;

templateList["swig"] = `
<ul>
{% for key, value in list %}
<li>User: {{value.user}} / Web Site: {{value.site}}</li>
{% endfor %}
</ul>`;

templateList["swig-raw"] = `
<ul>
{% for key, value in list %}
{% autoescape false %}<li>User: {{value.user}} / Web Site: {{value.site}}</li>{% endautoescape %}
{% endfor %}
</ul>`;
</ul>`,
};

/* ----------------- */

Expand Down Expand Up @@ -194,8 +126,8 @@ var testList = [
var source = templateList[id];
// console.log(fn.toString())
var html = "";
var fn = template.compile(source);
for (var i = 0; i < config.calls; i++) {
var fn = template.compile(source);
html = fn(data);
}
return html;
Expand All @@ -208,8 +140,8 @@ var testList = [
var id = config.escape ? "template-fast-mode" : "template-fast-mode-raw";
var source = templateList[id];
var html = "";
var fn = template.compile(source);
for (var i = 0; i < config.calls; i++) {
var fn = template.compile(source);
html = fn(data);
}
return html;
Expand All @@ -222,8 +154,8 @@ var testList = [
var id = config.escape ? "template" : "template-raw";
var source = templateList[id];
var html = "";
var fn = _.template(source);
for (var i = 0; i < config.calls; i++) {
var fn = _.template(source);
html = fn(data);
}
return html;
Expand All @@ -236,8 +168,8 @@ var testList = [
var id = config.escape ? "dot" : "dot-raw";
var source = templateList[id];
var html = "";
var fn = doT.template(source);
for (var i = 0; i < config.calls; i++) {
var fn = doT.template(source);
html = fn(data);
}
return html;
Expand All @@ -250,117 +182,25 @@ var testList = [
var id = config.escape ? "template" : "template-raw";
var source = templateList[id];
var html = "";
var fn = ejs.compile(source);
for (var i = 0; i < config.calls; i++) {
var fn = ejs.compile(source);
html = fn(data);
}
return html;
},
},

{
name: "Handlebars",
tester: function () {
var id = config.escape ? "handlebars" : "handlebars-raw";
var source = templateList[id];
var html = "";
var fn = Handlebars.compile(source);
for (var i = 0; i < config.calls; i++) {
html = fn(data);
}
return html;
},
},
{
name: "Eta",
tester: function () {
if (!config.escape) {
eta.defaultConfig.autoEscape = false;
}
var source = templateList["eta"];
// console.log(fn.toString())
var html = "";
data.$name = "temp";
var fn = eta.compile(source);
for (var i = 0; i < config.calls; i++) {
html = fn(data, eta.config);
}
return html;
},
},
{
name: "Squirrelly",
tester: function () {
if (!config.escape) {
Sqrl.defaultConfig.autoEscape = false;
}
var source = templateList["squirrelly"];
// console.log(fn.toString())
var html = "";
data.$name = "temp";
var fn = Sqrl.compile(source);
for (var i = 0; i < config.calls; i++) {
html = fn(data, Sqrl.defaultConfig);
}
return html;
},
},
{
name: "Squirrelly - Fast",
tester: function () {
if (!config.escape) {
Sqrl.defaultConfig.autoEscape = false;
}
var source = templateList["squirrelly-fast"];
// console.log(fn.toString())
var html = "";
data.$name = "temp";
var fn = Sqrl.compile(source);
for (var i = 0; i < config.calls; i++) {
html = fn(data, Sqrl.defaultConfig);
}
return html;
},
},
{
name: "Jade / pug",
tester: function () {
var id = config.escape ? "pug" : "pug-raw";
var source = templateList[id];
var pug = require("pug");
var html = "";
var fn = pug.compile(source);
for (var i = 0; i < config.calls; i++) {
html = fn(data);
}
return html;
},
},
{
name: "Mustache",
tester: function () {
var id = config.escape ? "mustache" : "mustache-raw";
var source = templateList[id];
var html = "";
Mustache.templateCache = undefined;
var id = config.escape ? "eta" : "eta-raw";

for (var i = 0; i < config.calls; i++) {
// mustache caches the template after the first parse
html = Mustache.render(source, data);
}
return html;
},
},

{
name: "swig",
tester: function () {
var id = config.escape ? "swig" : "swig-raw";
var source = templateList[id];
var html = "";
var fn = swig.compile(source);
data.$name = "temp";
for (var i = 0; i < config.calls; i++) {
html = fn(data);
var fn = etaInstance.compile(source);
html = etaInstance.render(fn, data);
}
return html;
},
Expand Down Expand Up @@ -498,12 +338,12 @@ function getLink() {
"length=" + config.length + "&calls=" + config.calls + "&escape=" + config.escape;
}

window["app"] = function (selector) {
window["load"] = function (selector) {
var app = document.querySelector(selector);
var body = `
<h1>Eta Browser Benchmarks</h1>
<br>
<em>Note: originally, Art-template's benchmarking page only benchmarked the template function after it was compiled. This benchmark includes compilation and rendering.</em>
<em>This benchmark of popular embedded template engines measures both compilation and rendering. Since the results can be somewhat inconsistent (and don't reflect the full picture, like feature support) this feature is best used by developers working on Eta.</em>
<br><br>
<em>Note: doT and Eta usually trade off the lead on unescaped templates. Keep in mind that Eta supports template tags inside strings & comments, plugins, whitespace trimming, etc.</em>
<br><br>
Expand Down

0 comments on commit 8e252a7

Please sign in to comment.