Event Delegation

What memory optimization does this implementation provide?

const delegate = (root, selector, events) => {
  const listeners = new WeakMap();
  
  events.forEach(([event, handler]) => {
    const wrapper = e => {
      const target = e.target.closest(selector);
      if (!target || !root.contains(target)) return;
      
      const boundHandler = listeners.get(target) || 
        listeners.set(target, handler.bind(target)).get(target);
      boundHandler(e);
    };
    
    root.addEventListener(event, wrapper);
  });
};

Reduced event listeners
Cached event handlers
Garbage collection friendly bindings
This implementation uses WeakMap for handler storage, providing memory-efficient handler binding. Benefits include: 1) Automatic garbage collection of handler references when elements are removed, 2) No memory leaks from handler bindings, 3) Efficient handler reuse for the same elements, 4) Maintained this context for handlers, 5) Clean handling of multiple event types. This pattern is particularly important for long-running applications or those with frequently changing DOM elements.
Smaller event objects

Next Question (17/20)