What is the difference between event bubbling and event capturing?

What is the difference between event bubbling and event capturing?

Event bubbling is when an event starts from the target element and bubbles up to the root. Event capturing is the opposite; it starts from the root and goes down to the target.

Can you give me an example of each?

Sure! In bubbling, if you click a button inside a div, the click event first triggers on the button, then on the div. In capturing, the event is triggered on the div first, then on the button.

How do I implement event capturing in JavaScript?

You can implement event capturing by adding an event listener with the third parameter set to true, like this: element.addEventListener('click', handler, true);.

Are there any performance differences between the two?

Generally, event bubbling is more commonly used and can be more efficient, but the performance difference is usually negligible for most applications.