Benchmark: JS Events Emitting 2

HTML Preparation code:

<script>
var Eev=function(){function e(e){this.head=new t,this.tail=new t(this.head),this.head.next=this.tail,this.linkConstructor=e,this.reg={}}function t(e,t,i){this.prev=e,this.next=t,this.fn=i||n}function n(){}function i(){this.events={}}var r=0;return e.prototype={insert:function(e){var n=new t(this.tail.prev,this.tail,e);return n.next.prev=n.prev.next=n,n},remove:function(e){e.prev.next=e.next,e.next.prev=e.prev}},t.prototype.run=function(e){this.fn(e),this.next&&this.next.run(e)},i.prototype={on:function(t,n){var i=this;t.split(/\W+/g).forEach(function(t){var o=i.events[t]||(i.events[t]=new e),s=n._eev||(n._eev=++r);o.reg[s]||(o.reg[s]=o.insert(n))})},off:function(e,t){var n=this;e.split(/\W+/g).forEach(function(e){var i=n.events[e],r=i.reg[t._eev];i.reg[t._eev]=void 0,i&&r&&i.remove(r)})},emit:function(e,t){var n=this.events[e];n&&n.head.run(t)}},i}();!function(e,t){var n=e.define;n&&n.amd?n([],t):"undefined"!=typeof module&&module.exports&&(module.exports=t())}(this,function(){return Eev});
//# sourceMappingURL=eev.min.js.map
  
  !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).EventEmitter3=t()}(this,(function(){"use strict";var e={exports:{}};return function(e){var t=Object.prototype.hasOwnProperty,n="~";function r(){}function o(e,t,n){this.fn=e,this.context=t,this.once=n||!1}function s(e,t,r,s,i){if("function"!=typeof r)throw new TypeError("The listener must be a function");var c=new o(r,s||e,i),f=n?n+t:t;return e._events[f]?e._events[f].fn?e._events[f]=[e._events[f],c]:e._events[f].push(c):(e._events[f]=c,e._eventsCount++),e}function i(e,t){0==--e._eventsCount?e._events=new r:delete e._events[t]}function c(){this._events=new r,this._eventsCount=0}Object.create&&(r.prototype=Object.create(null),(new r).__proto__||(n=!1)),c.prototype.eventNames=function(){var e,r,o=[];if(0===this._eventsCount)return o;for(r in e=this._events)t.call(e,r)&&o.push(n?r.slice(1):r);return Object.getOwnPropertySymbols?o.concat(Object.getOwnPropertySymbols(e)):o},c.prototype.listeners=function(e){var t=n?n+e:e,r=this._events[t];if(!r)return[];if(r.fn)return[r.fn];for(var o=0,s=r.length,i=new Array(s);o<s;o++)i[o]=r[o].fn;return i},c.prototype.listenerCount=function(e){var t=n?n+e:e,r=this._events[t];return r?r.fn?1:r.length:0},c.prototype.emit=function(e,t,r,o,s,i){var c=n?n+e:e;if(!this._events[c])return!1;var f,u,a=this._events[c],l=arguments.length;if(a.fn){switch(a.once&&this.removeListener(e,a.fn,void 0,!0),l){case 1:return a.fn.call(a.context),!0;case 2:return a.fn.call(a.context,t),!0;case 3:return a.fn.call(a.context,t,r),!0;case 4:return a.fn.call(a.context,t,r,o),!0;case 5:return a.fn.call(a.context,t,r,o,s),!0;case 6:return a.fn.call(a.context,t,r,o,s,i),!0}for(u=1,f=new Array(l-1);u<l;u++)f[u-1]=arguments[u];a.fn.apply(a.context,f)}else{var p,v=a.length;for(u=0;u<v;u++)switch(a[u].once&&this.removeListener(e,a[u].fn,void 0,!0),l){case 1:a[u].fn.call(a[u].context);break;case 2:a[u].fn.call(a[u].context,t);break;case 3:a[u].fn.call(a[u].context,t,r);break;case 4:a[u].fn.call(a[u].context,t,r,o);break;default:if(!f)for(p=1,f=new Array(l-1);p<l;p++)f[p-1]=arguments[p];a[u].fn.apply(a[u].context,f)}}return!0},c.prototype.on=function(e,t,n){return s(this,e,t,n,!1)},c.prototype.once=function(e,t,n){return s(this,e,t,n,!0)},c.prototype.removeListener=function(e,t,r,o){var s=n?n+e:e;if(!this._events[s])return this;if(!t)return i(this,s),this;var c=this._events[s];if(c.fn)c.fn!==t||o&&!c.once||r&&c.context!==r||i(this,s);else{for(var f=0,u=[],a=c.length;f<a;f++)(c[f].fn!==t||o&&!c[f].once||r&&c[f].context!==r)&&u.push(c[f]);u.length?this._events[s]=1===u.length?u[0]:u:i(this,s)}return this},c.prototype.removeAllListeners=function(e){var t;return e?(t=n?n+e:e,this._events[t]&&i(this,t)):(this._events=new r,this._eventsCount=0),this},c.prototype.off=c.prototype.removeListener,c.prototype.addListener=c.prototype.on,c.prefixed=n,c.EventEmitter=c,e.exports=c}(e),e.exports}));
  //# sourceMappingURL=eventemitter3.umd.min.js.map
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://unpkg.com/mitt/dist/mitt.umd.js"></script>

Script Preparation code:

var e = new Eev();
var c = 0;

e.on('go', function (d) {
  ++c;
});

e.on('go', function (d) {
  ++c;
});

var e$ = $({});
var c = 0;

e$.on('go', function (d) {
  ++c;
});

e$.on('go', function (d) {
  ++c;
});

var c = 0;

document.addEventListener('go', function(d) {
  ++c;
});

document.addEventListener('go', function(d) {
  ++c;
});

var emitter = window.mitt();
 var c = 0;
// listen to an event
emitter.on('foo', function(d){
++c;
} );
 
emitter.on('foo', function(d){
++c;
} );

var EE = new EventEmitter3()
  , context = { foo: 'bar' };

function emitted() {
  ++c;
}

EE.on('another-event', emitted, context);

Tests:

EEV
e.emit('go', 'hi');
JQuery
e$.trigger('go', 'hi');
Dom
document.dispatchEvent(new CustomEvent('go', { detail:'hi' }));
Mitt
emitter.emit('foo', { 'hello':'' });
EventEmitter3
EE.emit('another-event', { 'hello':'' });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
EEV
JQuery
Dom
Mitt
EventEmitter3

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Browser/OS: Chrome 108 on Windows

View result in a separate tab

Test name	Executions per second
EEV	697875.4 Ops/sec
JQuery	106983.0 Ops/sec
Dom	52273.9 Ops/sec
Mitt	460155.2 Ops/sec
EventEmitter3	1169461.0 Ops/sec

JS Events Emitting 2 (version: 0)

Comparing Various Event Emitter Options

Comparing performance of: EEV vs JQuery vs Dom vs Mitt vs EventEmitter3

Created: one year ago by: Guest

Jump to the latest result

EEV

JQuery

Dom

Mitt

EventEmitter3

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A