Maison  >  Article  >  interface Web  >  Résumé de la façon dont JavaScript améliore les performances du code

Résumé de la façon dont JavaScript améliore les performances du code

伊谢尔伦
伊谢尔伦original
2017-07-26 13:47:321180parcourir

Utiliser le style de calcul d'accumulation de chaîne

L'utilisation de l'opération + créera une nouvelle chaîne en mémoire et lui attribuera la valeur concaténée. Attribuez simplement le résultat à une variable.
Afin d'éviter de connecter les variables intermédiaires du résultat, vous pouvez utiliser += pour attribuer directement le résultat.

Code qui s'exécute lentement :

a += 'x' + 'y';

Code qui s'exécute plus rapidement :

a += 'x'; a += 'y';


Les opérations primaires seront plus rapides que les appels de fonction
Vous pouvez envisager d'utiliser des opérations primitives alternatives dans les boucles et les fonctions avec des exigences de performances critiques.
Code qui s'exécute lentement :

var min = Math.min(a, b); 
arr.push(val);

Code qui s'exécute plus rapidement :

var min = a < b ? a : b; 
arr[arr.length] = val;

Lors de la définition de setTimeout() et setInterval() Pass un nom de fonction au lieu d'une chaîne

Si vous transmettez une chaîne à setTimeout() ou setInterval(), la chaîne sera évaluée lentement.
Utilisez plutôt un wrapper de fonction anonyme afin qu'il puisse être interprété et optimisé au moment de la compilation.

Code qui s'exécute lentement :

setInterval(&#39;doSomethingPeriodically()&#39;, 1000); 
setTimeOut(&#39;doSomethingAfterFiveSeconds()&#39;, 5000);

Code qui s'exécute plus rapidement :

setInterval(doSomethingPeriodically, 1000); 
setTimeOut(doSomethingAfterFiveSeconds, 5000);

Évitez d'utiliser du DOM indésirable dans les objets Citation

Ne faites pas ça :

var car = new Object(); 
car.color = "red"; 
car.type = "sedan"

Une meilleure forme :

var car = { 
color : "red"; 
type : "sedan" 
}

Vitesse cible la plus claire, minimisez la chaîne de portée

Méthode inefficace :

var url = location.href;

Un formulaire efficace :

var url = window.location.href;

Essayez d'utiliser moins de commentaires dans les scripts et évitez d'utiliser des noms de variables longs
. Gardez les commentaires le moins possible ou évitez de les utiliser autant que possible, notamment dans les fonctions, les boucles et les tableaux.
Les commentaires ralentissent inutilement l’exécution du script et augmentent la taille du fichier. Par exemple :

Forme non recommandée :

function someFunction() 
{ 
var person_full_name="somename"; /* stores the full name*/ 
}

Meilleure façon d'écrire :

function someFunction() 
{ 
var name="somename"; 
}

Stocker en dehors du champ d'application actuel des variables d'application
Lorsqu'une fonction est exécutée dans le contexte d'exécution, un objet actif contenant toutes les variables locales sera poussé au début de la chaîne de contexte.
Dans la chaîne de scope, les plus lents sont des identifiants clairement identifiés, ce qui signifie que les variables locales sont les plus rapides. La lecture et l’écriture des variables externes fréquemment utilisées seront nettement plus rapides. Ceci est particulièrement visible pour les variables globales et autres recherches approfondies d’identifiants.
De même, les variables dans la portée actuelle (var myVar) sont accessibles plus rapidement que les objets comme les propriétés (this.myVar).

Code qui s'exécute lentement :

function doSomething(text) { 
var ps = document.getElementsByTagName(&#39;p&#39;), 
text = [&#39;foo&#39;, /* ... n ... */, &#39;bar&#39;]; 
for (var i = 0, l = ps.length; i < l; i++) { 
ps[i].innerHTML = text[i]; 
} 
}

Code qui s'exécute plus rapidement :

function doSomethingFaster(text) { 
var doc = document, 
ps = doc.getElementsByTagName(&#39;p&#39;), 
text = [&#39;foo&#39;, /* ... n ... */, &#39;bar&#39;]; 
for (var i = 0, l = ps.length; i < l; i++) { 
ps[i].innerHTML = text[i]; 
} 
}

Si vous avez besoin d'accéder à un élément comme head ) Dans une grande boucle, il est plus rapide d'utiliser un accès DOM local (comme get dans l'exemple).
Code qui s'exécute plus rapidement :

function doSomethingElseFaster() { 
var get = document.getElementsByTagName; 
for (var i = 0, i < 100000; i++) { 
get(&#39;head&#39;); 
} 
}

Utilisez des variables pour mettre en cache les valeurs
Utilisez des variables locales pour mettre en cache les valeurs là où vous effectuez un travail répété.
L'ensemble d'exemples suivant illustre les vastes implications du stockage de valeurs dans des variables locales.

Exemple 1. Utiliser des variables pour stocker des fonctions mathématiques dans le corps de la boucle avant l'exécution du calcul
Méthode incorrecte :

var d=35; 
for (var i=0; i<1000; i++) { 
y += Math.sin(d)*10; 
}

Meilleur traitement :

var d = 55; 
var math_sind = Math.sin(d)*10; 
for (var i=0; i<1000; i++) { 
y += math_sind; 
}


Exemple 2. Sauvegarde de la longueur du tableau en boucle
Mauvaise manipulation :
La longueur du tableau sera recalculée à chaque fois

for (var i = 0; i < arr.length; i++) { 
// do something 
}

Meilleure amélioration :
Une meilleure La méthode consiste à enregistrer la longueur du tableau

for (var i = 0, len = arr.length; i < len; i++) { 
// do something 
}

En général, si cela a été fait une fois, nous n'avons pas besoin de faire un travail inutile à plusieurs reprises. Par exemple, si la valeur d'une expression calculée est utilisée plusieurs fois dans une portée ou une fonction, l'enregistrer dans une variable permet de l'utiliser plusieurs fois, sinon nous en ferions trop en déclarant une variable et en lui attribuant une valeur qui s'applique uniquement. une fois. Alors s’il vous plaît, gardez cela à l’esprit.


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn