前端杂谈 · Web

前端性能优化 使用高效的事件处理

小编 · 5月1日 · 2020年

有时候感觉页面反映不够灵敏,是因为有太多频繁执行的事件处理器被添加到了 DOM 树的不同元素上,这就是推荐使用事件委托的原因。

前端性能优化 使用高效的事件处理

如果一个 div 里面有 10 个按钮,应该只给 div 容器添加一个事件处理器,而不是给每个按钮都添加一个。事件能够冒泡,所以可以捕获事件并得知哪个按钮是事件源。

另外,你不必等到 onload 事件来开始处理 DOM 树,DOMContentLoaded 更快。大多时候你需要的只是想访问的元素已在 DOM 树中,所以你不必等到所有图片被下载。

  1. 减少绑定事件监听的节点,如通过事件委托;
  2. 尽早处理事件,在DOMContentLoaded即可进行,不用等到load以后。
0 条回应

必须 注册 为本站用户, 登录 后才可以发表评论!