wasm: Add benchmark script

Author: pdubroy

packages/wasm/package.json

@@ -28,6 +28,7 @@
     "ava": "^6.2.0",
     "esbuild": "^0.25.5",
     "liquid-html-parser": "link:@shopify/liquid-html-parser",
+    "mitata": "^1.0.34",
     "wabt": "1.0.37-nightly.20250428"
   },
   "peerDependencies": {

packages/wasm/scripts/bench.ts

@@ -0,0 +1,86 @@
+import {readFileSync} from 'node:fs';
+import {dirname, join} from 'node:path';
+import {fileURLToPath} from 'node:url';
+import {run, bench, group, summary} from 'mitata';
+import * as ohm from 'ohm-js';
+
+import es5js from '../../../examples/ecmascript/index.js';
+import {makeEs5Matcher, wasmMatcherForGrammar} from '../test/_helpers.js';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const datadir = join(__dirname, '../test/data');
+
+const inputs = {
+  bookReview: readFileSync(join(datadir, '_book-review.liquid'), 'utf-8'),
+  featuredProduct: readFileSync(join(datadir, '_featured-product.liquid'), 'utf-8'),
+  footer: readFileSync(join(datadir, '_footer.liquid'), 'utf-8'),
+  html5shiv: readFileSync(join(datadir, '_html5shiv-3.7.3.js'), 'utf-8'),
+  underscore: readFileSync(join(datadir, '_underscore-1.8.3.js'), 'utf-8')
+};
+
+const es5Matcher = await makeEs5Matcher();
+
+function matchWithInput(m, input) {
+  m.setInput(input);
+  return m.match();
+}
+
+const liquid = ohm.grammars(readFileSync(join(datadir, '_liquid-html.ohm'), 'utf8'));
+const liquidMatcher = await wasmMatcherForGrammar(liquid.LiquidHTML);
+
+group('ES5: html5shiv', () => {
+  summary(() => {
+    bench('Wasm', () => {
+      matchWithInput(es5Matcher, inputs.html5shiv);
+    });
+    bench('JS', () => {
+      es5js.grammar.match(inputs.html5shiv);
+    });
+  });
+});
+
+group('ES5: underscore', () => {
+  summary(() => {
+    bench('Wasm', () => {
+      matchWithInput(es5Matcher, inputs.underscore);
+    });
+    bench('JS', () => {
+      es5js.grammar.match(inputs.underscore);
+    });
+  });
+});
+
+group('LiquidHTML: book-review.liquid', () => {
+  summary(() => {
+    bench('Wasm', () => {
+      matchWithInput(liquidMatcher, inputs.bookReview);
+    });
+    bench('JS', () => {
+      liquid.LiquidHTML.match(inputs.bookReview);
+    });
+  });
+});
+
+group('LiquidHTML: featured-product.liquid', () => {
+  summary(() => {
+    bench('Wasm', () => {
+      matchWithInput(liquidMatcher, inputs.featuredProduct);
+    });
+    bench('JS', () => {
+      liquid.LiquidHTML.match(inputs.featuredProduct);
+    });
+  });
+});
+
+group('LiquidHTML: footer.liquid', () => {
+  summary(() => {
+    bench('Wasm', () => {
+      matchWithInput(liquidMatcher, inputs.footer);
+    });
+    bench('JS', () => {
+      liquid.LiquidHTML.match(inputs.footer);
+    });
+  });
+});
+
+await run();

packages/wasm/test/_helpers.js

@@ -1,8 +1,10 @@
 /* global process */
 
 import {WasmMatcher} from '@ohm-js/miniohm-js';
+import * as ohm from 'ohm-js';
 
 import {Compiler} from '../src/index.js';
+import es5fac from './data/_es5.js';
 
 const DEBUG = process.env.OHM_DEBUG === '1';
 
@@ -29,3 +31,35 @@ export async function wasmMatcherForGrammar(grammar) {
   }
   return m._instantiate(bytes, debugImports);
 }
+
+function ES5Matcher(rules) {
+  // `rules` is an object with the raw rule bodies.
+  // The WasmMatcher constructor requires a grammar object, so we create
+  // one and manually add the rules in.
+  const g = ohm.grammar('ES5 { start = }');
+  for (const key of Object.keys(rules)) {
+    g.rules[key] = {
+      body: rules[key],
+      formals: [],
+      description: key,
+      primitive: false,
+    };
+  }
+  // Since this is called with `new`, we can't use `await` here.
+  return wasmMatcherForGrammar(g);
+}
+
+export async function makeEs5Matcher() {
+  return es5fac({
+    Terminal: ohm.pexprs.Terminal,
+    RuleApplication: ohm.pexprs.Apply,
+    Sequence: ohm.pexprs.Seq,
+    Choice: ohm.pexprs.Alt,
+    Repetition: ohm.pexprs.Star,
+    Not: ohm.pexprs.Not,
+    Range: ohm.pexprs.Range,
+    any: ohm.pexprs.any,
+    end: ohm.pexprs.end,
+    Matcher: ES5Matcher,
+  });
+}