Why was .live() slowing down my page?

Question

I was using JQuery code on my page to send a user's selection from a drop-down to the server. For some reason when I used .live() like this:

$(".rNameSelect:not(.srchCntnt .rNameSelect)").live("change", function(){
        var rName=$(this).val();
        $("#managersViewTabs .mgrCntnt").load("managerview.do?type=report&reportName=" + encodeURIComponent(rName));
    });

the page got progressively slower each time I clicked on another choice in the drop-down! When I changed it like this:

$(".rNameSelect:not(.srchCntnt .rNameSelect)").change(function(){
        var rName=$(this).val();
        $("#managersViewTabs .mgrCntnt").load("managerview.do?type=report&reportName=" + encodeURIComponent(rName));
    });

the problem was solved! Why is .live() slow? Did I really want .live() or is .change() okay to use?

i would recommend you not to use `.live ()`, it has been depricated since 1.8, better use `.on()` — Dhaval Marthak, Jul 29 '13 at 16:21

score 1 · Accepted Answer · edited May 23 '17 at 12:05

1

When you'r using .live() it will work like a trigger and the script will need keep runing until this action happens. And it'll consume RAM gradative.

When you use .change() on that case, the jquery will assume this change on native javascript event. And it'll be lot more faster.

Take a look here and here to understand better how events work on jquery.

edited May 23 '17 at 12:05

Community

1
1

answered Jul 29 '13 at 16:30

Guerra

2,792
1
22
32

score 0 · Answer 2 · answered Jul 29 '13 at 16:31

.live() method slow since it is only used to register the event handler on the document. Your events always delegate all the way up to the document. This can affect performance if your DOM is deep.

My suggestion, use .on() method because you setting the event handler in the part what that you want.

Why was .live() slowing down my page?

2 Answers2