Questions de code pour Jquery

Question

Quel code fonctionnera le plus rapidement?

for(i=0; i<100; i++) { 
    jQuery("#myDiv").append("<span>" + i + "</span>"); 
} 
// 

var i, markup = ""; 
for (i=0; i<100; i++) { 
    markup += "<span>" + i + "</span>"; 
} 
// 

jQuery("#myDiv").append(markup); 

// 
var i, markup = ""; 
for (i=0; i<100; i++) { 
    markup += "<span>" + i + "</span>"; 
} 

// 
jQuery("#myDiv").append("<div>" + markup + "</div>"); 

// 

Answer 1

Il est difficile de dire, mais voici une meilleure, fonctionne mieux sur les chaînes plus grandes:

var markup = []; 
for(int i=0;i<100;i++){ 
    markup.push('<span>' + i + '</span>'); 
} 
jQuery('#myDiv').append(markup); 

Answer 2

Je suppose que celui-ci:

jQuery("#myDiv").append(markup); 

Je suppose qu'il est presque pas de différence avec celui-ci:

jQuery("#myDiv").append("<div>" + markup + "</div>"); 

La raison, je pense que le premier scénario serait le plus lent, est que vous créez l'objet jQuery 100 fois plutôt qu'une fois.

Bien sûr, il est toujours préférable de profiler ou de tester autrement les problèmes de performances. Consultez le post Deep Profiling jQuery apps de John Resig.

Answer 3

regard sur ce lien pour améliorer votre jquery

http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

pointe spéciale 6 et 7

donc mieux de la liste est la suivante:

// 
var i, markup = ""; 
for (i=0; i<100; i++) { 
    markup += "<span>" + i + "</span>"; 
} 

// 
jQuery("#myDiv").append("<div>" + markup + "</div>"); 

Answer 4

Il est très facile à test:

1. Le troisième est le plus rapide car jQuery aura un élément wrapper, seul celui-ci doit être attaché au parent et c'est fait. C'est 3-5x plus rapide puis les deux autres.

2. Le premier sera le second parce que jQuery ajoute directement tous les éléments sans avoir à gérer les grandes chaînes.

3. deuxième sera le plus lent, car après la chaîne géante a été créé, il n'a aucun élément racine, de sorte que les <span> s sera ajouté un par un à la société mère.

note: L'ordre réel des deux derniers peut varier selon les navigateurs. Ils sont quelque peu identiques.