Jquery live() vs delegado() [duplicado]
He leído algunas publicaciones aquí y en otros lugares de la web sobre las diferencias entre live()y delegate(). Sin embargo, no he encontrado la respuesta que estoy buscando (si esto es una trampa, dímelo).
Sé que la diferencia entre livey delegatees que liveno se puede usar en cadena. También leí en alguna parte que delegateen algunos casos es más rápido (mejor rendimiento).
Mi pregunta es, ¿existe alguna situación en la que debas usar liveen lugar de delegate?
ACTUALIZAR
He configurado una prueba sencilla para ver la diferencia en el rendimiento.
También agregué lo nuevo .on()que está disponible en jQuery 1.7+
Los resultados resumen prácticamente los problemas de rendimiento como se indican en las respuestas.
- No lo use
.live()a menos que su versión de jQuery no sea compatible.delegate(). - No lo use
.delegate()a menos que su versión de jQuery no sea compatible.on().
La diferencia entre .live()y .delegate()es MUCHO mayor que entre delegate()y .on().
Nunca uso live; Considero que los beneficios de consumir delegateson tan sustanciales que abrumadores.
El único beneficio de livees que su sintaxis es muy parecida a la de bind:
$('a.myClass').live('click', function() { ... });
delegate, sin embargo, utiliza una sintaxis un poco más detallada:
$('#containerElement').delegate('a.myClass', 'click', function() { ... });
Sin embargo, esto me parece mucho más explícito acerca de lo que realmente está sucediendo. Por el ejemplo, no te das cuenta livede que los eventos en realidad se están capturando document; con delegate, está claro que la captura del evento ocurre en #containerElement. Puedes hacer lo mismo con live, pero la sintaxis se vuelve cada vez más horrible.
Especificar un contexto para capturar los eventos también mejora el rendimiento. Con el liveejemplo, cada clic en todo el documento debe compararse con el selector a.myClasspara ver si coincide. Con delegate, eso es solo los elementos internos #containerElement. Obviamente esto mejorará el rendimiento.
Finalmente, liverequiere que tu navegador busque a.myClass si existe o no actualmente . delegatesolo busca los elementos cuando se activan los eventos, lo que brinda una ventaja adicional de rendimiento.
NB delegateusa livedetrás de escena, por lo que puedes hacer cualquier cosa liveque puedas hacer con delegate. Mi respuesta trata sobre ellos tal como se usan comúnmente.
Tenga en cuenta también que ni liveni delegatees la mejor manera de realizar la delegación de eventos en jQuery moderno. La nueva sintaxis (a partir de jQuery 1.7) es con la onfunción. La sintaxis es la siguiente:
$('#containerElement').on('click', 'a.myClass', function() { ... });
Son exactamente iguales excepto:
.delegate()le permite limitar la sección local de la página, mientras que.live()debe procesar eventos en toda la página..live()comienza con una selección DOM desperdiciada
Cuando llamas .delegate(), simplemente se da vuelta y llama .live(), pero pasa el parámetro de contexto adicional .
https://github.com/jquery/jquery/blob/master/src/event.js#L948-950
Como tal, siempre usaría .delegate(). Si realmente necesita que procese todos los eventos en la página, simplemente proporciónelo bodycomo contexto.
$(document.body).delegate('.someClass', 'click', function() {
// run handler
});
Las versiones anteriores de jQuery en realidad tienen delegatefuncionalidad. Solo necesita pasar un selector o elemento como propiedad de contexto al llamar .live(). Por supuesto, debe cargarse en la página.
$('.someClass', '#someContainer').live('click',function() {
// run handler
});
Y tienes el mismo comportamiento que .delegate().
