jquery解绑事件速度增加

Question

我有一个很大的内容幻灯片有点页面,我正在制作,它开始使用大量的事件触发器.其中大约一半使用livequery插件.

通过在幻灯片之间卸载这些事件,我是否会看到速度提升,因此只有活动幻灯片绑定了事件？

原生的livequery也比livequery插件快得多吗？(因为它的功能肯定不那么强)

unbind livequery事件也是？

我真的只需要知道卸载/加载一个事件监听器需要多长时间,以及如果我让它们保持运行它们正在吃多少个循环.此外,有关直播活动的任何信息都很棒.

Answer 1

我需要更多细节来提供实际代码,但您可能希望查看事件委派:

事件委托是指父对象上使用单个事件侦听器侦听事件发生在其子(或更深层的后代).事件委托允许开发人员在他们的事件监听器应用程序中稀疏,同时仍然对事件做出反应,因为它们发生在高度特定的目标上.这被证明是在事件丰富的Web项目中保持高性能的关键策略,其中创建数百个事件侦听器可以快速降低性能.

一个快速,基本的例子:

假设您有一个带图像的DIV,如下所示:

<div id="container">
    <img src="happy.jpg">
    <img src="sad.jpg">
    <img src="laugh.jpg">
    <img src="boring.jpg">
</div>

但是,不是4个图像,而是100或200.您希望将单击事件绑定到图像,以便在用户单击它时执行X操作.大多数人的第一个代码可能如下所示:

$('#container img').click(function() {
    performAction(this);
});

这将绑定一大堆事件处理程序,这将阻碍页面的性能.使用事件委派,您可以执行以下操作:

$('#container').click(function(e) {
    if($(e.target)[0].nodeName.toUpperCase() == 'IMG') {
        performAction(e.target);
    }
});

这只会将1个事件绑定到实际容器,然后您可以通过使用事件的target属性并相应地委派来确定单击的内容.不过,这仍然是一种痛苦,而且如果不通过使用jQuery的live功能完成所有这些,您实际上可以获得显着的性能提升:

$('#container img').live('click', function() {
     performAction(this);
});

希望这可以帮助.