我有一个相对较大的 DOM,并且注意到在元素上触发事件时,chrome 的性能会出现令人难以置信的下降。单个事件例如:
myElem.trigger('myevent.myscope',arguments);
需要 14 毫秒!! (22.0.1229.92 m)
同一事件在 Firefox 15.0.1 和 msie 9 中触发时间不到 1 毫秒!
该元素是一个 jquery 对象并且已被缓存,因此在触发之前不会发生 DOM 查找。我正在使用 console.time()
console.time('trigger');
myElem.trigger('myevent.myscope',arguments);
console.timeEnd('trigger');
有人可以解释一下这种情况吗
谢谢
加里
请您参考如下方法:
这不是对您问题的直接回答。
但根据我在自定义事件方面的经验,我会避免使用触发器/jquery 事件。
取决于 jQuery 版本。触发 dom 树的冒泡,这可能需要相当长的时间。
"As of jQuery 1.3, .trigger()ed events bubble up the DOM tree; an event handler can stop the bubbling by returning false from the handler or calling the .stopPropagation() method on the event object passed into the event. " - trigger
我个人的解决方案是使用 Peter Higgins Pubsub .
我创建了一个 jsperf 测试,显示 jquerys 'on 的性能差异。 ' (蓝色是 pubsub,红色是 jquery,越长越好[每秒操作数]); http://jsperf.com/peter-higgins-pubsub-vs-tiny-pubsub
从现在开始,我在处理自定义事件时使用 pubsub,在处理点击、鼠标悬停等事件时使用 jquery。
只是我的2美分。
