Edit in JSFiddle

function createElements(rootSelector,count){

    var root=document.querySelector(rootSelector);
    
    for ( var i=0; i< count; i++){
    
        let button=document.createElement("button");
        button.innerText=i+1;
        button.style.padding="10px";
        root.appendChild(button);
    
    }

};

function normalBind(rootSelector){

     var elements=document.querySelectorAll(rootSelector+" button");
     
     //bind all buttons
     for (let i=0; i<elements.length; i++){
     
         elements[i].addEventListener("click",function(){
         
             console.log("click in single element");
             sp.end("standardClick");
         }); 
     }
     
};

function targetBind(rootSelector){

         document.querySelector(rootSelector).addEventListener("click",function(e){
         
             if (e.target.tagName=="BUTTON"){
             
             sp.end("delegateClick");
             console.log("click in single element by target");
             
             }
             
         });
};

createElements('#root',50000);

var sp=new Speeder();
sp.start("standard");
normalBind('#root');
sp.end("standard");

sp.start("delegate");
targetBind('#root');
sp.end("delegate");

sp.compare("standard","delegate");

sp.start("standardClick");
sp.start("delegateClick");

document.querySelectorAll("button")[1000].click();//trigger o 1000 button

sp.compare("standardClick","delegateClick");

<div id="root">

</div>

body {
    direction: ltr;
}

#root{
  
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
}