标签: 事件委托

浏览器事件传播遵循捕获、目标、冒泡三阶段模型。通过`stopPropagation`等方法控制传播，CSS `pointer-events`等实现事件穿透。事件委托提高性能，合成事件优化框架。被动监听器提升滚动性能，`AbortController`防内存泄漏。关注事件优先级、Web Components事件处理及DevTools调试技巧，遵循最佳实践。

React 合成事件系统提供跨浏览器兼容性和性能优化，通过事件委托和优先级调度提升体验。React 17 将事件委托到 root 节点并移除事件池。合成事件与原生事件混用时需注意执行顺序和传播控制。针对高频事件，可使用被动监听器，并避免内存泄漏。性能敏感场景可考虑原生事件与 `requestAnimationFrame`。

埋点技术是Web应用数据收集核心。传统方法为每个元素绑定监听器，性能较差，动态元素支持不足。全局监听通过事件委托，性能更优，动态元素支持好，但灵活性较差。全局监听可通过事件过滤、防抖节流等优化。适用于元素多且动态、轻量级埋点、事件类型统一的场景。需根据场景选择合适方案，以实现高效埋点。

本文介绍了React的合成事件机制，它通过事件委托和合成事件抹平浏览器差异，优化性能。React 17将事件委托到root节点，移除了事件池。文章还讨论了原生事件与合成事件的响应顺序，`passive`事件监听器的作用，事件委托的优缺点，以及自定义事件的创建和使用，最后总结了阻止浏览器默认行为的方法。