Run results for: addEventListener vs jQuery

Run details:

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:97.0) Gecko/20100101 Firefox/97.0

Browser: Firefox 97

Operating system: Windows

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
addEventListener	85.9 Ops/sec
addEventListener anon	33.9 Ops/sec
$().click	1397.6 Ops/sec
$().click anon	840.7 Ops/sec
onclick	461.6 Ops/sec
onclick anon	431.6 Ops/sec

HTML Preparation code:

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div>
<div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div>
<div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div>
<div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div>
<div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div><div>Test</div>

Script Preparation code:

var divs = document.getElementsByTagName('div');
for (let d of divs) {
  $(d).unbind().prop("onclick", null);
}

Tests:

addEventListener
const f = () => console.log('hi'); for (let d of divs) { d.addEventListener('click', f); }
addEventListener anon
for (let d of divs) { d.addEventListener('click', () => console.log('hi')); }
$().click
const f = () => console.log('hi'); for (let d of divs) { $(d).click(f); }
$().click anon
for (let d of divs) { $(d).click(() => console.log('hi')); }
onclick
const f = () => console.log('hi'); for (let d of divs) { d.onclick = f; }
onclick anon
for (let d of divs) { d.onclick = () => console.log('hi'); }

Run results for: addEventListener vs jQuery

addEventListener

addEventListener anon

$().click

$().click anon

onclick

onclick anon