JavaScript: Is there any performance benefit to stopping event propagation?

Question

Is it considered 'good practice' to stop JavaScript event propagation - does it benefit performance in any way?

I'm wondering if there is benefit outside of layout purposes where you stop propagation so you don't trigger multiple events accidentially.

Answer 1

It entirely depends on the DOM complexity and the actions taken in each event that is triggered.

You would stop propagating events mainly not because of complexity but because of unwanted actions not to take place.

For example: Consider a situation where you have a show hide div and when you click on the div it should open and if you click anywhere else in the document it should close.

So you would wire an onclick event handler to the document as well as the div. So you have to stop propagating the event when clicked on the div so that the document click handler won't be invoked. That's a situation where you use stop event propagation.

Answer 2

Only when it is necessary to the program logic, such as to prevent form submission or another DOM element's action being triggered. Unless you have a seriously complex DOM tree, there will not be any serious performance hit.