chore: add todolist for benchmark case

benchmark/.eslintrc.json

@@ -1,5 +1,7 @@
 {
+  "extends": ["standard"],
   "rules": {
-    "no-unused-expressions": "off"
+    "no-unused-expressions": "off",
+    "@typescript-eslint/no-var-requires": "off"
   }
 }

benchmark/demo.js

@@ -1,5 +1,5 @@
-import * as Benchmark from 'benchmark'
-import { Context, TagToken, Liquid } from '../src/liquid'
+const Benchmark = require('benchmark')
+const { Liquid } = require('..')
 
 const engine = new Liquid({
   root: __dirname,
@@ -7,11 +7,11 @@ const engine = new Liquid({
 })
 
 engine.registerTag('header', {
-  parse: function (token: TagToken) {
+  parse: function (token) {
     const [key, val] = token.args.split(':')
     this[key] = val
   },
-  render: function (ctx: Context) {
+  render: function (ctx) {
     const title = this.liquid.evalValue(this.content, ctx)
     return `<h1>${title}</h1>`
   }
@@ -32,16 +32,18 @@ const template = `
 </ul>
 `
 
-export function demo () {
+function demo () {
   console.log('--- demo ---')
   return new Promise(resolve => {
     new Benchmark.Suite('demo')
       .add('demo', {
         defer: true,
-        fn: (d: any) => engine.parseAndRender(template, ctx).then((x: any) => d.resolve(x))
+        fn: d => engine.parseAndRender(template, ctx).then(x => d.resolve(x))
       })
-      .on('cycle', (event: any) => console.log(String(event.target)))
+      .on('cycle', event => console.log(String(event.target)))
       .on('complete', resolve)
       .run({ 'async': true })
   })
 }
+
+module.exports = { demo }

benchmark/index.js

@@ -0,0 +1,15 @@
+const { output } = require('./output')
+const { tag } = require('./tag')
+const { demo } = require('./demo')
+const { layout } = require('./layout')
+const { memory } = require('./memory')
+
+async function main () {
+  // await output()
+  // await tag()
+  // await demo()
+  // await layout()
+  await memory()
+}
+
+main()

benchmark/index.ts

@@ -1,15 +0,0 @@
-import { output } from './output'
-import { tag } from './tag'
-import { demo } from './demo'
-import { layout } from './layout'
-import { memory } from './memory'
-
-async function main () {
-  await output()
-  await tag()
-  await demo()
-  await layout()
-  await memory()
-}
-
-main()

benchmark/layout.js

@@ -1,5 +1,5 @@
-import * as Benchmark from 'benchmark'
-import { Liquid } from '../src/liquid'
+const Benchmark = require('benchmark')
+const { Liquid } = require('..')
 
 const engineOptions = {
   root: __dirname,
@@ -17,20 +17,22 @@ const template = `
 {% block body %}a small body{% endblock %}
 `
 
-export function layout () {
+function layout () {
   console.log('--- layout ---')
   return new Promise(resolve => {
     new Benchmark.Suite('layout')
       .add('cache=false', {
         defer: true,
-        fn: (d: any) => engine.parseAndRender(template, {}).then((x: any) => d.resolve(x))
+        fn: d => engine.parseAndRender(template, {}).then(x => d.resolve(x))
       })
       .add('cache=true', {
         defer: true,
-        fn: (d: any) => cachingEngine.parseAndRender(template, {}).then((x: any) => d.resolve(x))
+        fn: d => cachingEngine.parseAndRender(template, {}).then(x => d.resolve(x))
       })
-      .on('cycle', (event: any) => console.log(String(event.target)))
+      .on('cycle', event => console.log(String(event.target)))
       .on('complete', resolve)
       .run({ 'async': true })
   })
 }
+
+module.exports = { layout }

benchmark/memory.js

@@ -0,0 +1,57 @@
+const { join } = require('path')
+const { readFileSync } = require('fs')
+const { getHeapStatistics } = require('v8')
+const { Liquid } = require('..')
+
+const engineOptions = {
+  root: __dirname,
+  extname: '.liquid'
+}
+
+const engine = new Liquid(engineOptions)
+
+const SAMPLE_COUNT = 1024
+
+function memory () {
+  console.log('--- memory ---')
+  html()
+  todolist()
+}
+
+function html () {
+  const str = readFileSync(join(__dirname, 'templates/lorem-html.liquid'), 'utf8')
+
+  global.gc()
+  const base = getHeapStatistics().used_heap_size
+  const templates = []
+
+  for (let i = 0; i < SAMPLE_COUNT; i++) {
+    templates.push(engine.parse(str))
+  }
+  global.gc()
+
+  const diff = (getHeapStatistics().used_heap_size - base) / SAMPLE_COUNT
+  console.log(`${h(str.length)} HTML template x ${h(diff)}/instance (${SAMPLE_COUNT} instances sampled)`)
+}
+
+function todolist () {
+  const str = readFileSync(join(__dirname, 'templates/todolist.liquid'), 'utf8')
+
+  global.gc()
+  const base = getHeapStatistics().used_heap_size
+  const templates = []
+
+  for (let i = 0; i < SAMPLE_COUNT; i++) {
+    templates.push(engine.parse(str))
+  }
+  global.gc()
+
+  const diff = (getHeapStatistics().used_heap_size - base) / SAMPLE_COUNT
+  console.log(`${h(str.length)} Todo template x ${h(diff)}/instance (${SAMPLE_COUNT} instances sampled)`)
+}
+
+function h (size) {
+  return (size / 1024).toFixed(3) + ' kB'
+}
+
+module.exports = { memory }

benchmark/memory.ts

@@ -1,32 +0,0 @@
-import { join } from 'path'
-import { readFileSync } from 'fs'
-import { getHeapStatistics } from 'v8'
-import { Liquid } from '../src/liquid'
-
-const engineOptions = {
-  root: __dirname,
-  extname: '.liquid'
-}
-
-const engine = new Liquid(engineOptions)
-
-const templateString = readFileSync(join(__dirname, 'templates/lorem-html.liquid'), 'utf8')
-const templateSizeKb = templateString.length / 1024
-
-const NB_INSTANCES_TO_RETAIN = 250
-
-export function memory () {
-  console.log('--- memory ---')
-  const initialUsedHeapSize = getHeapStatistics().used_heap_size
-  const templates = []
-
-  for (let i = 0; i < NB_INSTANCES_TO_RETAIN; i++) {
-    templates.push(engine.parse(templateString))
-  }
-
-  const finalUsedHeapSize = getHeapStatistics().used_heap_size
-  const heapDifference = finalUsedHeapSize - initialUsedHeapSize
-  const avgRetainedPerTemplate = (heapDifference / NB_INSTANCES_TO_RETAIN) / 1024
-
-  console.log(`retained memory for a ${templateSizeKb}KB template: ${avgRetainedPerTemplate}KB (${NB_INSTANCES_TO_RETAIN} samples)`)
-}

benchmark/output.js

@@ -1,9 +1,9 @@
-import * as Benchmark from 'benchmark'
-import { Liquid } from '../src/liquid'
+const Benchmark = require('benchmark')
+const { Liquid } = require('..')
 
 const liquid = new Liquid()
 
-export function output () {
+function output () {
   console.log('--- output ---')
   return new Promise(resolve => {
     new Benchmark.Suite('output')
@@ -12,15 +12,17 @@ export function output () {
       .add('date', test('{{"now" | date: "%d%Y%m"}}'))
       .add('escape', test('{{"1<2" | escape}}'))
       .add('default', test('{{"" | default: 3}}'))
-      .on('cycle', (event: any) => console.log(String(event.target)))
+      .on('cycle', (event) => console.log(String(event.target)))
       .on('complete', resolve)
       .run({ 'async': true })
   })
 }
 
-function test (str: string) {
+function test (str) {
   return {
     defer: true,
-    fn: (d: any) => liquid.parseAndRender(str).then((x: any) => d.resolve(x))
+    fn: d => liquid.parseAndRender(str).then(x => d.resolve(x))
   }
 }
+
+module.exports = { output }

benchmark/tag.js

@@ -1,9 +1,9 @@
-import * as Benchmark from 'benchmark'
-import { Liquid } from '../src/liquid'
+const Benchmark = require('benchmark')
+const { Liquid } = require('..')
 
 const liquid = new Liquid()
 
-export function tag () {
+function tag () {
   console.log('--- tag ---')
   return new Promise(resolve => {
     new Benchmark.Suite('tag')
@@ -16,15 +16,17 @@ export function tag () {
       .add('increment', test('{%increment a%}'))
       .add('decrement', test('{%decrement a%}'))
       .add('tablerow', test('{%tablerow i in (1..10) cols:3%}{%endtablerow%}'))
-      .on('cycle', (event: any) => console.log(String(event.target)))
+      .on('cycle', (event) => console.log(String(event.target)))
       .on('complete', resolve)
       .run({ 'async': true })
   })
 }
 
-function test (str: string) {
+function test (str) {
   return {
     defer: true,
-    fn: (d: any) => liquid.parseAndRender(str).then((x: any) => d.resolve(x))
+    fn: d => liquid.parseAndRender(str).then(x => d.resolve(x))
   }
 }
+
+module.exports = { tag }

benchmark/templates/todolist.liquid

@@ -0,0 +1,49 @@
+<section class="todo-list">
+    <h1>
+        posuere cubilia Curae; Vestibulum hendrerit malesuada odio. Fusce ut elit
+        ut augue sollicitudin blandit. Phasellus volutpat lorem. Duis non pede et
+        neque luctus tincidunt. Duis interdum tempus elit.
+        <small>Aenean metus. Vestibulum ac lacus. Vivamus porttitor, massa ut.</small>
+    </h1>
+    <a href={{"/add" | url}} class="todo-add"><i class="fa fa-plus-square"></i>Add Todo</a>
+    <ul class="filter-category">
+        {% for i in (0..categories.length) %}
+        {% assign item=categories[i] %}
+        <li style="background: {{ item.color }}">
+            <a href="/todos/category/{{ item.id }}">{{ item.title }}</a>
+        </li>
+        {% endfor %}
+    </ul>
+    {% for todo in todos %}
+    <div>
+        <h2>
+            Todo {{ forloop.index }}:
+            <span class="todo-item content" data-todo-index="{{ forloop.index0 }}">
+                {{ todo.title | prepend: 'TODO: ' | upcase }}
+            </span>
+        </h2>
+    
+        <img
+            title="risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices"
+            src="{% include "todo-icon", id=todo.id }} %}"
+        >
+
+        <p class="description">
+            Purus eu mi. Proin commodo, massa commodo dapibus elementum,
+            libero lacus pulvinar eros, ut tincidunt nisl elit ut velit. Cras rutrum
+            porta purus. Vivamus lorem. Sed turpis enim, faucibus quis, pharetra in,
+            sagittis sed, magna. Curabitur ultricies felis ut libero. Nullam tincidunt
+            enim eu nibh. Nunc eget ipsum in sem facilisis convallis. Proin fermentum
+        </p>
+
+        <div class="todo-meta">
+            {% if todo.category %}
+                <span>{{  todo.category.title | capitalize }}</span>
+            {% endif %}
+        </div>
+        <a class="btn btn-primary" href={{"/edit/" | append todo.id | url }}><i class="fa fa-pencil"></i> Edit</a>
+        <a class="btn btn-default"><i class="fa fa-check"></i> Check</a>
+        <a class="btn ben-danger" href={{"/delete/" | append todo.id | url }}><i class="fa fa-trash-o"</i> Trash</a>
+    </div>
+    {% endfor %}
+</section>