Est-ce que jquery vit ralentir des sites Web?

Question

J'ai un problème J'utilise les onglets jquery U.I qui chargent tout avec ajax. Maintenant que je l'ai maintenant à chaque fois que vous cliquez sur un onglet, une vue partielle est chargée dans cet onglet. Maintenant, dans cette vue partielle, il existe des fichiers javascript qui utilisent jquery pour lier tous les événements nécessaires dans cet onglet, plus quelques plugins jquery que j'utilise.

Maintenant, chaque fois que cet onglet est chargé tous ces scripts sont chargés. Si on clique 10 fois dessus, alors ces scripts sont chargés 10 fois jusqu'à maintenant chacun de mes boutons aura maintenant 10 des mêmes événements, cela signifie que si quelqu'un clique sur ce bouton 10 événements vont tous se déclencher et faire la même chose.

J'ai donc besoin de trouver une solution pour soit déplacer tout le script et l'avoir sur la page principale et utiliser jquery.live ou une autre solution. J'ai essayé d'utiliser la mise en cache de jquery pour les onglets de l'interface utilisateur, mais cela ne fonctionnera pas car certaines choses dans l'onglet Tab A quand on change l'effet Tab B je dois recharger l'onglet B mais les scripts ne peuvent pas recharger autrement rencontrer le même problème que maintenant.

Answer 1

Read here pour une présentation agréable couvrant la délégation d'événements de jQuery.

Après avoir lu l'aspect ci-dessus à ceci:

// 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)); 

Vous ne devriez pas avoir à vous soucier des problèmes de performances lors de l'utilisation de la méthode ci-dessus, sauf si vous créez une application aussi complexe que gmail, docs, ou google wave .

Answer 2

i toujours, en règle générale, appelle unbind() avant bind()

Answer 3

Au lieu d'utiliser .live(), pensez à utiliser la délégation de l'événement à la place. Écoutez un événement dans un conteneur, puis inspectez le tag et les attributs pour décider comment le gérer.

Beaucoup plus efficace si vous ajoutez un tas d'éléments au DOM.