jQuery Girl
  1. jQuery Girl
  3. jQuery, qu’est-ce qui est plus rapide: sélecteurs ou méthodes?
Intereting Posts
jquery opacity cross browser? jQuery UI Datepicker – n’autorise que certains jours de la semaine return false ne fonctionne pas dans mon clic de soumission ASP.NET MVC Chargement d’un contenu de page dans une div à l’aide de JQuery Jquery Pagination uniquement afficher prev and next Postes ColdFusion CFC CORS et AJAX Améliorez les performances des gros volumes pour de grandes quantités de données Remplacer l’URL dans la barre d’adresse par un sous-domaine sans SOURIR redirigeant comment afficher ‘loading’ avant que le contenu des tabs jquery soit chargé Obtenir une valeur d’atsortingbut de l’atsortingbut ALT d’un lien hypertexte Formulaire CSS: Styliser le parent (étiquette) d’une boîte radio en fonction du statut coché / décoché Convertissez 24 heures variables en 12 heures avec AngularJS / jQuery Comment empêcher le corps de défiler avec le menu push-side jqgrid ne soumet pas la valeur de la page de réinitialisation lors du déclenchement du rechargement jQuery datepicker désactiver les dimanches et tableau de dates spécifique

jQuery, qu’est-ce qui est plus rapide: sélecteurs ou méthodes?

Disons que j’ai $('mySelector:first'); et $('mySelector').first(); . Quel est le moyen le plus efficace? J’ai regardé dans la source, mais je ne pouvais toujours pas comprendre.

Dans le premier cas, jQuery passe en revue tous les éléments jusqu’à obtenir le premier: 

 CHILD: function( elem, match ) { var type = match[1], node = elem; switch ( type ) { ... case "first": while ( (node = node.previousSibling) ) { if ( node.nodeType === 1 ) { return false; } } if ( type === "first" ) { return true; } node = elem; ... } }

Dans le second cas, jQuery coupe la collection, mais je ne suis pas sûr de son efficacité: 

 function first() { return this.eq( 0 ); }; function eq( i ) { return i === -1 ? this.slice( i ) : this.slice( i, +i + 1 ); };

La réponse acceptée actuellement n’est pas cohérente avec les tests de nombreux navigateurs comparant :first et :eq(0) à .first() et .eq(0) .

Pour les principaux navigateurs de bureau actuels:
$('foo').first() est presque quatre fois plus rapide que $('foo:first')

Si vous souhaitez inspecter la méthodologie, voici les tests et leurs résultats actuels .

Le second devrait récupérer TOUS les éléments du sélecteur avant d’obtenir le premier. Ainsi, si le sélecteur était constitué de 10 000 éléments, il en extrairait tous les 10 000, puis les premiers de ce groupe. J’espère que le premier sera meilleur à cet égard puisqu’il filtrera pendant la recherche (et s’arrêtera après la découverte du premier). Probablement sortingvial dans la plupart des cas, cependant.

Bien sûr, si vous chaînez des fonctions, cela peut être inévitable: 

 $('.someclass').addClass('otherClass').first().addClass('firstClass');

Dans mes tests, $('mySelector:first'); est plus rapide que $('mySelector').first();

Vous pouvez également être intéressé par ceci ;

Comparez $('li:first') à $('li').first() , je parie que le premier doit être plus rapide. Parce que, par exemple, dans un document contenant 100 li , la deuxième requête construirait simplement une liste de 100 éléments et renverrait ensuite le premier; Par contre, la première requête s’arrêtera juste après le retour de la première li.

Même si la requête est gérée de manière native par le navigateur, elle nécessite toujours plus de mémoire que la première.