Chrome事件触发在大型DOM中需要很长时间

Question

我有一个相对较大的DOM,并且在触发元素上的事件时注意到chrome的性能下降令人难以置信.单个事件,例如:

myElem.trigger('myevent.myscope',arguments);

需要14ms !! (22.0.1229.92 m)

firefox 15.0.1和msie 9中的同一事件需要不到1ms才能触发!

该元素是一个jquery对象,并且已被缓存,因此在触发器之前不会发生DOM查找.我正在使用console.time()

console.time('trigger');
myElem.trigger('myevent.myscope',arguments);
console.timeEnd('trigger');

有人能否对这种情况有所了解

谢谢

加里

Answer 1

这不是对你的问题的直接回答。

但根据我在自定义事件方面的经验，我会避免使用触发器/jquery 事件。

取决于 jQuery 版本。触发 dom 树上的冒泡，这可能需要相当长的时间。

“从 jQuery 1.3 开始，.trigger()ed 事件在 DOM 树中冒泡；事件处理程序可以通过从处理程序返回 false 或在传递到事件中的事件对象上调用 .stopPropagation() 方法来停止冒泡。” -扳机

我个人的解决方案是使用 Peter Higgins Pubsub。

我创建了一个 jsperf 测试来显示 jquery 的性能差异'我创建了一个 jsperf 测试，显示 jquerys ' on（蓝色是 pubsub，红色是 jquery，越长越好 [每秒操作数]）； http://jsperf.com/peter-higgins-pubsub-vs-tiny-pubsub

从现在开始，我在处理自定义事件时使用 pubsub，在处理单击、鼠标悬停等事件时使用 jquery。

只是我的2分钱。