addEventListener vs WMEL

Benchmark created on May 6, 2025

Description

Preparation HTML

<button id="target"></button>

Setup

/* esm.sh - wmel@0.1.1/mod */
var t=new WeakMap,a="\0",listen=function(i,n,o){a.includes(`\0${n}\0`)||(addEventListener(n,s=>t.get(s.target)?.[n]?.forEach?.(r=>r?.(s)),{passive:!0}),a+=n+"\0");let e=t.get(i);e||t.set(i,e={});let d=(e[n]||=[]).push(o)-1;return function(){e[n][d]=void 0}};
//# sourceMappingURL=mod.mjs.map

const test_1_addEventListener = Document.prototype.addEventListener.bind(
	document.querySelector("#target"),
	"click",
	({ target }) => console.log("clicked: ", target)
);

const test_2_WMEL = listen.bind(
	null,
	document.querySelector("#target"),
	"click",
	({ target }) => console.log("clicked: ", target)
)

Test runner

test_1_addEventListener()

test_2_WMEL()

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

• Revision 1: published on May 6, 2025