Maison > interface Web > js tutoriel > 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

伊谢尔伦
Libérer: 2017-07-26 13:47:32
original
1249 Les gens l'ont consulté

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';
Copier après la connexion

Code qui s'exécute plus rapidement :

a += 'x'; a += 'y';
Copier après la connexion


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);
Copier après la connexion

Code qui s'exécute plus rapidement :

var min = a < b ? a : b; 
arr[arr.length] = val;
Copier après la connexion

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);
Copier après la connexion

Code qui s'exécute plus rapidement :

setInterval(doSomethingPeriodically, 1000); 
setTimeOut(doSomethingAfterFiveSeconds, 5000);
Copier après la connexion

É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"
Copier après la connexion

Une meilleure forme :

var car = { 
color : "red"; 
type : "sedan" 
}
Copier après la connexion

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

Méthode inefficace :

var url = location.href;
Copier après la connexion

Un formulaire efficace :

var url = window.location.href;
Copier après la connexion

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*/ 
}
Copier après la connexion

Meilleure façon d'écrire :

function someFunction() 
{ 
var name="somename"; 
}
Copier après la connexion

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]; 
} 
}
Copier après la connexion

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]; 
} 
}
Copier après la connexion

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;); 
} 
}
Copier après la connexion

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; 
}
Copier après la connexion

Meilleur traitement :

var d = 55; 
var math_sind = Math.sin(d)*10; 
for (var i=0; i<1000; i++) { 
y += math_sind; 
}
Copier après la connexion


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 
}
Copier après la connexion

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 
}
Copier après la connexion

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal