Hola, he estado buscando en Internet tratando de descubrir la mejor práctica para agregar eventlistener a mis sitios web y, en general, se trata de dos enfoques de la siguiente manera:
Agregar un detector de eventos a cada elemento (por ejemplo, botón) usando un bucle:
document.querySelectorAll('.some-button').forEach(item => { item.addEventListener('click', event => { //handle click }) })
O bien, use el burbujeo de eventos para usar solo un oyente y verifique el e.target para cada escenario:
body.addEventListener('click', event => { if (event.target !== element1 && event.target !== element2) { //return } //handle click }
Sin embargo, no pude encontrar ningún artículo que comparara el rendimiento de estos 2 enfoques. Desde mi comprensión limitada, cada vez que hay un 'clic', javascript recorrerá todos los detectores de eventos de todos modos (aunque no haya hecho clic en él) y por esa razón estoy tomando el segundo enfoque (usando un detector de eventos) que parece ser el más fácil de manejar.
Agradezco si alguien puede proporcionar más información sobre el posible inconveniente del segundo enfoque y si habrá algún problema de rendimiento, gracias.