J’ai essayé de trouver une réponse et j’ai trouvé une question connexe, et bien qu’ils confirment mes conclusions ( qu’un appel à sélecteur multiple est plus lent que plusieurs appels à sélecteur simple ), aucun d’eux ne me dit pourquoi.
En gros, lorsque vous exécutez ce code:
$("#one, #two").hide(); $("#one, #two").show();
Contre ce code:
$("#one").hide(); $("#two").hide(); $("#one").show(); $("#two").show();
Ensuite, ce dernier sera plus rapide d’environ 50%.
Cependant, une fois que nous avons ajouté un troisième sélecteur, la différence de performances est 39% plus rapide.
Quasortingème différence de sélecteur: 26% plus rapide.
Cinquièmement: 30% plus rapide.
Sixième: 31% plus rapide.
Dix: 31% plus rapide.
(Notez que ces valeurs semblent se situer dans une marge d’environ 5%)
Nous obtenons donc quelque chose qui ressemble à ceci:
La performance semble se stabiliser autour de 6 sélecteurs. Cela ne semble jamais être “plus rapide” que d’être 31% plus lent que de passer par chacun des appels. Pourquoi donc?
Personnellement, j’aime utiliser plusieurs sélecteurs par appel, mais il semble avoir un impact (relativement) important sur les performances. Quand cela serait-il (non) approprié d’utiliser?
Dans les deux cas, vous utilisez des identifiants. Vous pouvez donc le convertir en appel natif à getElementById
.
Cependant, dans le 1er cas, 2 choses supplémentaires doivent être faites
Je suppose que la deuxième opération prend le plus de temps.