Just the other day I posted about how much I love using jsPerf to run performance tests for jQuery snippets, so today I’m going to talk about my latest test. Many a times I’ve read that the jQuery delegate is faster than live, however only recently I realized it was also faster than event binding. To summarize, jQuery delegate is about the fastest method of binding events to elements, single or multiple. The reason for this is that binding to a set of elements binds to each element individually, where as binding to the parent element with children delegated binds the event to the parent only. More info on this can be found on the article “24 ways: Your jQuery now with less Suck” by Scott Kosman. Feel free to check out my test case on jsPerf and if you’d like to contest or try to prove a faster method I’d love the challenge.
An added benefit of delegate I have discovered is that when you delegate to something with class, and later remove that class, that delegation updates thus removing itself from the object. For example lets say you have a delegation bound to a button that has a class of disabled to start with, later when you meet the requirements to enable that button and remove the disabled class that button no longer has the disabled delegation assigned to it, thus it undelegated itself without any extra code effort. Check out this test case on jsFiddle. This has proven to be a very helpful technique, and surely adds to the reasons to use delegate over bind.