Tal como dije en el título, estoy aprendiendo JS y quiero que mi código tenga el mejor rendimiento posible. Vi un video en el que el youtuber decía que aplicar addEventListener("clic") al documento y usar declaraciones if para diferenciar "cómo" activó el evento es más efectivo y tiene un mejor rendimiento que aplicarlo individualmente

EJEMPLO

 $document.addEventListener("click",(e)=>{ if (e.target.matches("nav i img")){ console.log("logrado"); if (hamburgerMenuState == false){ $hamburgerMenu.classList.add("left-zero"); $hamburgerMenu.classList.remove("left-away"); hamburgerMenuState = true; } else{ $hamburgerMenu.classList.remove("left-zero"); $hamburgerMenu.classList.add("left-away"); hamburgerMenuState = false; } } else if(e.target.matches("#hamburger-menu ul li a")){ console.log("nahse") $hamburgerMenu.classList.remove("left-zero"); $hamburgerMenu.classList.add("left-away"); hamburgerMenuState = false; } else if(e.target.matches("#seccion1 #iniciarReloj")){ $btnIniciarReloj.disabled = true; intervalo = setInterval(()=>{ console.log(intervalo); let fecha = new Date(); $document.getElementById("reloj").textContent = fecha.toLocaleTimeString(); },1000) } else if(e.target.matches("#seccion1 #detenerReloj")){ $btnIniciarReloj.disabled = false; clearInterval(intervalo); $document.getElementById("reloj").textContent = ""; } else if(e.target.matches("#seccion1 #iniciarAlarma")){ audio.play(); } else if(e.target.matches("#seccion1 #detenerAlarma")){ audio.pause(); audio.currentTime = 0; } })