¿JQuery en vivo ralentiza los sitios web?

Question

Tengo un problema Estoy usando pestañas jquery U.I que cargan todo con ajax. Ahora lo tengo ahora, cada vez que haces clic en una pestaña, una vista parcial se carga en esa pestaña.

Ahora, en esta vista parcial, son archivos javascript que usan jquery para enlazar todos los eventos que se necesitan en esa pestaña más algunos complementos de jquery que estoy usando.

Ahora, cada vez que se carga esa pestaña, todas esas secuencias de comandos se cargan. Si se hace clic 10 veces, esas secuencias de comandos se cargan 10 veces hasta ahora, cada una de las cuales dice que mis botones ahora tendrán 10 de los mismos eventos. Si alguien hace clic en ese botón, 10 eventos se dispararán y harán lo mismo.

Así que tengo que encontrar una solución para mover todo el script y tenerlo en la página principal y usar jquery.live o alguna otra solución.

Traté de usar el almacenamiento en caché de jquery para las pestañas de la IU, pero esto no funcionará ya que algunas cosas dicen la Pestaña A cuando cambian efecto Pestaña B que significa que necesito volver a cargar la Pestaña B pero las secuencias de comandos no se pueden cargar. se encuentra con el mismo problema que ahora.

Answer 1

Read here para una presentación agradable que cubre la delegación de eventos de jQuery.

Después de leer la mirada por encima de esto;

// using jQuery 1.4.2 
(function($){ 
    // You can cache the container you plan on using for event delegation. 
    // If using $(document).ready(...) to call the below functions 
    //  your "container" element should already exist in the DOM 
    // (the .specialAjaxLink elements don't have to exist yet). 
    var container = $("#container"); 

    // whenever an element with the class "specialAjaxLink" is clicked 
    // while inside your container element execute the handler on them. 
    container.delegate(".specialAjaxLink", "click", function(){ 
     // do something amazing... 
     solveWorldHunger(this); 
     // stop propagation and prevent default... 
     return false; 
    }); 
}(jQuery)); 

Usted no debería tener que preocuparse por problemas de rendimiento cuando se utiliza el método anterior, a menos que está creando una aplicación tan compleja como Gmail, Docs o Google Wave .

Answer 2

siempre, por regla general, llamo unbind() antes de bind()

Answer 3

En lugar de utilizar .live(), considerar el uso de delegación de eventos en su lugar. Escuche un evento dentro de un contenedor, luego inspeccione la etiqueta y los atributos para decidir cómo manejarlo.

Mucho más eficiente si agrega un montón de elementos al DOM.