Run results for: Drupal once (variables in URL)

https://www.drupal.org/project/drupal/issues/2402103 Change the number of div created and the number of once items with URL parameters: to create 100 divs with 5 different "once" items add to the URL: ?div=100&once=5 to create 5 divs with 100 different "once" items add to the URL: ?div=5&once=100

Go to the benchmark

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:81.0) Gecko/20100101 Firefox/81.0

Browser: Firefox 81

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: 3 years ago

Test name	Executions per second
jQuery.once (div=10, once=3)	50643.6 Ops/sec
once (div=10, once=3)	83997.9 Ops/sec

HTML Preparation code:


<script src='https://unpkg.com/jquery@3.5.1/dist/jquery.min.js'></script>
<script src='https://unpkg.com/jquery-once@2.2.3/jquery.once.min.js'></script>
<!-- IE Polyfills -->
<script>String.prototype.repeat||(String.prototype.repeat=function(t){"use strict";if(null==this)throw new TypeError("can't convert "+this+" to object");var e=""+this;if((t=+t)!=t&&(t=0),t<0)throw new RangeError("repeat count must be non-negative");if(t==1/0)throw new RangeError("repeat count must be less than infinity");if(t=Math.floor(t),0==e.length||0==t)return"";if(e.length*t>=1<<28)throw new RangeError("repeat count must not overflow maximum string size");var r=e.length*t;for(t=Math.floor(Math.log(t)/Math.log(2));t;)e+=e,t-=1;return e+=e.substring(0,r-e.length)}),Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);</script>
<script src='https://unpkg.com/once-dom@3.5.0/dist/once.min.js'></script>
  
<div id="wrapper"></div>

Script Preparation code:

var totalDivs = 10, totalOnce = 3;
var wrapper = document.querySelector('#wrapper');
var $wrapper = jQuery(wrapper);

// uglysauce to make it work on IE11
var params = parent.window.location.search.replace('?', '').split('&');
params.forEach(function (par) { 
  var d = par.split('=');
  if (d[0] === 'div') { totalDivs = parseInt(d[1]); }
  if (d[0] === 'once') { totalOnce = parseInt(d[1]); }
})
wrapper.innerHTML = '<div class="test"></div>'.repeat(totalDivs); 

// Add some info in the test name to be able to compare things
var extra = ' (div=' + totalDivs + ', once=' + totalOnce + ')';
var newjQo = 'jQuery.once ' + extra;
var newO =  'once ' + extra;

parent.document.querySelector('[data-row-for^="jQuery.once"]').setAttribute('data-row-for', newjQo);
parent.document.querySelector('[data-row-for^="once"]').setAttribute('data-row-for', newO);
// Change the test names in the string that will be eval'ed right after this one.
content = content.replace("'jQuery.once'", "'" + newjQo + "'").replace("'once'", "'" + newO + "'");

Tests:

jQuery.once
for (var i = 0; i < totalOnce; i++) { $wrapper.find('.test').once('test' + i); }
once
for (var i = 0; i < totalOnce; i++) { once('test' + i, '.test', wrapper); }