事件处理程序的性能是否取决于子元素的数量
我在一个表上有一个 mousedown 事件处理程序,其行数动态增加(现在超过一千,从角度来看应该是无限的),并且我观察到随着预加载行数的增加,性能下降。事件处理程序的目的很简单 - 找出单击了哪一行并突出显示它。
我不知道到底是什么原因导致速度变慢,并且我不确定它是否是事件处理程序。我只是想知道可能触发 mousedown 气泡的子元素数量是否会影响附加到单个父元素的事件处理程序的性能?
更新:我在这里想出了一个简单的例子:http ://client.infinity-8.me/table.php?num=1000 (您可以传递任何您想要的数字),基本上它会呈现一个包含 num 行的表格,并附加一个事件处理程序父表。我应该由此得出结论,实际上,由于子元素的数量而导致性能没有明显下降。
I've got a single mousedown event handler on a table with dynamically increasing number of rows (right now over thousand, in perspective should have been unlimited) and I observe a drop down in performance as the number of preloaded rows increases. The purpose of event handler is simple - figure out which row was clicked and highlight it.
I do not know exactly what causes the slowdown and I'm not sure if it's event handler. I just wonder if number of child elements that could trigger mousedown bubble can affect the performance of an event handler attached to single parent element?
Update: I came up with simple example here: http://client.infinity-8.me/table.php?num=1000 (you can pass whatever number you want to num), basically it renders a table with num rows and has a single event handler attached to a parent table. I should conclude from this, that there actually is no noticeable dropdown in performance, caused by number of child elements.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
理论上不应该。只有深度才重要,因为冒泡是通过检查每个级别的处理程序(每个级别一个)来提升的。
即使在 IE6 上,它也能在处理 10 000 元素时表现出色。
查看实际操作。
In theory it shouldn't. Only deepness should matter, since bubbling goes up by checking handlers on every level (one per level).
It performs great with 10 000 elements even on IE6.
See it in action.