JQuery - Why is “live” inefficient? And how can we measure that?

I suppose it is inefficient because the handler is placed at the root node, and relies on bubbling to catch the event and run the proper handler.

I suppose it is inefficient because the handler is placed at the root node, and relies on bubbling to catch the event and run the proper handler. One alternative would be to simply bind your handler to your dynamically created elements when they are created and added to the DOM. Another alternative is to bind a single handler to a container, and let your events bubble up to that.

This can be nice if you have lots of identical elements added to a container. Element element element element Bind a click handler to #myContainer instead of each .myElement. $('#myContainer').

Click(function(e) { $target = $(e. Target); if($target. Closest('.

MyElement'). Length) { // Run my code for the click } }); I image this may suffer from some of the same inefficiencies as .live(), but ought to be better as it is more localized. New .

MyElement items added, automatically work. EDIT: According to the docs: As of jQuery 1.4, event bubbling can optionally stop at a DOM element "context". This would seem to create a similar effect to the last method I mentioned.

EDIT: As suggested by Nick Craver, jQuery's .delegate() method can produce a similar effect more cleanly. Example courtesy of Nick: $('#myContainer'). Delegate('.

MyElement', 'click' function() { alert($(this).text()); }).

One nice thing about the method I mentioned is that you don't have the overhead of handlers on multiple elements. – user113716 May 11 '10 at 22:59 1 +1 if you give an example :) your current markup would use this: $('#myContainer'). Delegate('.

MyElement', 'click' function() { alert($(this).text()); }); – Nick Craver? May 11 '10 at 23:00 1 @patrick - It binds a handler just like .live() using a context (actually .delegate" rel="nofollow">.delegate() calls .live() internally) instead of listening on document for bubbles, it listens on the element you bound it to, so it's the same behavior, just grabs the bubble much earlier. – Nick Craver?

May 11 '10 at 23:02 @Nick Craver - Thanks much. Just took a look at the docs too, and I misunderstood .delegate" rel="nofollow">.delegate(). Thanks for the tip.

I included your solution. – user113716 May 11 '10 at 23:04.

Live() might only be considered inefficient if: There is a small amount of elements to be bound to an event (An example of benchmarking the performance of live() you can try is by profiling a fragment of code that uses live() to bind a click handler to an element and also profile another fragment of code that uses click() to bind to that same element. I'm not too sure what end result you'll have but I'm sure it'll be interesting.

As @patrick suggests it can be inefficient because it requires processing for all events on the document, whether the bubble reaches your element or not. This is where delegate can help as it works in the same way as live but allows it to only effect a smaller proportion of the document by limiting it to a common parent (using his example) $('#myContainer'). Delegate('div.

MyElement', 'click', function(){}).

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions