Comment accélérer votre code JavaScript.
Réduire l'activité en Loops
Les boucles sont souvent utilisés dans la programmation.
Chaque énoncé dans une boucle, y compris la for instruction, est exécutée pour chaque itération de la boucle.
Rechercher des déclarations ou des affectations qui peuvent être placés en dehors de la boucle.
Bad Code Promo:
for (i = 0; i < arr.length; i++) {
Mieux code:
l = arr.length;
for (i = 0; i < l; i++) {Le mauvais code accède à la propriété de longueur d'un tableau à chaque fois que la boucle est itérée.
Le meilleur code accède à la propriété de longueur en dehors de la boucle, et fait tourner en boucle plus rapide.
Réduire DOM Accès
Accès au DOM HTML est très lent, comparé à d'autres instructions JavaScript.
Si vous prévoyez d'accéder à un élément DOM à plusieurs reprises, y accéder une fois, et l'utiliser comme une variable locale:
Réduire DOM Taille
Gardez le nombre d'éléments dans le code HTML DOM petite.
Ce sera toujours d'améliorer le chargement des pages, et d'accélérer le rendu (affichage de la page), en particulier sur des appareils plus petits.
Toute tentative de recherche dans le DOM (comme getElementsByTagName) bénéficiera d'un DOM plus petit.
Évitez les variables inutiles
Ne pas créer de nouvelles variables si vous ne prévoyez pas d'enregistrer des valeurs.
Souvent, vous pouvez remplacer le code comme ceci:
var fullName = firstName + " " + lastName;
document.getElementById("demo").innerHTML = fullName;
Avec ça:
document.getElementById("demo").innerHTML = firstName + " " + lastName
Retard JavaScript Chargement
Mettre vos scripts au bas du corps de la page, permet au navigateur de charger la première page.
Alors qu'un script est téléchargement, le navigateur ne démarre pas d'autres téléchargements. En outre toutes les activités d'analyse et le rendu peut être bloqué.
La spécification HTTP définit que les navigateurs ne devraient pas télécharger plus de deux composants en parallèle.
Une alternative consiste à utiliser defer="true" dans la balise script. L'attribut defer spécifie que le script doit être exécuté après que la page a terminé l'analyse, mais il ne fonctionne que pour les scripts externes.
Si possible, vous pouvez ajouter votre script à la page par le code, après la page est chargée:
Exemple
<script>
window.onload = downScripts;
function downScripts() {
var element = document.createElement("script");
element.src = "myScript.js";
document.body.appendChild(element);
}
</script>Évitez d'utiliser avec
Évitez d' utiliser le mot - clé avec. Il a un effet négatif sur la vitesse. Il a également encombre les étendues JavaScript.
Le mot - clé avec est pas autorisé en mode strict.