event-delegation

What problem does it solve?

Event delegation reduces prop drilling and the need to attach handlers to every child by placing a single listener on a parent container, using event.target to identify the source component.

Core Features & Use Cases

• Single parent event listener that handles actions for many child elements.
• Reduces prop drilling across deeply nested components and improves performance.
• Ideal for dynamic lists/grids where items are created or removed at runtime and each item supports actions via data attributes.

Quick Start

Attach a single onClick handler to a parent container and mark actionable elements with data-action attributes. In the handler, use closest('[data-action]') to identify the action and optionally read data-id for item identity, then dispatch the appropriate function.