JavaScript Profiler | Expliqué

En JavaScript, tout en traitant des codes impliquant des complexités, il est nécessaire d'une sorte d'outil efficace pour analyser le temps et la mémoire de compilation consommés pour effectuer chacune des fonctionnalités du code. Dans un tel cas, le profileur JavaScript se demande à gérer diverses fonctionnalités. Quelques-uns d'entre eux seront discutés dans cet article.

Qu'est-ce qu'un profileur JavaScript?

JavaScript Profiler est un outil très efficace pour comprendre le code d'une meilleure manière. En plus de cela, cela aide beaucoup dans l'amélioration «vitesse d'exécution"Et en informer les consommés"mémoire" et "temps"Contre chacune des fonctionnalités effectuées. Pour résumer, il joue un grand rôle dans l'analyse et l'optimisation efficace du code global.

Dans la section suivante, la mise en œuvre du profileur JavaScript sur diverses fonctionnalités sera démontrée.

Nous appliquerons le fonctionnement du profileur JavaScript à ce qui suit:

• "changer" Déclaration.
• "Fonction spécifiée".

Tutoriel pour exécuter le profileur javascript

• Cliquez avec le bouton droit sur l'onglet ouvert et cliquez sur "Inspecter l'élément".
• Après cela, indiquez les 3 points dans le coin supérieur droit.
• Dans les options déclarées, sélectionnez plus d'outils -> Profiler JavaScript. Le "Profiler JavaScript”La fenêtre s'ouvrira en conséquence.
• Maintenant, cliquez sur le "commencer”Option dans le profil javascript et exécutez les fonctionnalités de code.
• Une fois les fonctionnalités exécutées, cliquez sur le «arrêt" option. Cela entraînera la notification de l'utilisateur du temps consommé contre chacune des fonctionnalités.

Manifestation

Ici, le profileur est appliqué pour vérifier les fonctionnalités du «alerte«Boîte de dialogue et l'événement« OnMouseover »attaché.

Exemple 1: Application du profileur JavaScript sur l'instruction Switch

Dans l'exemple suivant, les boîtes de dialogue invite / alerte et le ««changer»La déclaration sera appliquée pour être traitée au profileur JavaScript.

Tout d'abord, demandez à l'utilisateur de saisir le nom par rapport aux cas fournis:

var get = invite ("Entrez le nom:")

Ensuite, incluez le «changer”Instruction pour accéder à la valeur d'entrée et afficher le message correspondant par rapport à la valeur correspondante:

commutateur (get)
cas "David":
alerte ("le nom est David")
casser;
cas "Alex":
alerte ("le nom est Alex")
casser;

Sortir

Dans la sortie ci-dessus, on peut observer que le profileur JavaScript affiche le temps consommé dans le fonctionnement de chacune des fonctionnalités séparément dans le code démontré ci-dessus.

Exemple 2: Application du profileur JavaScript sur la fonction spécifiée

Dans cet exemple, vérifiez le temps consommé du profileur JavaScript pour gérer une fonction particulière.

Premièrement, spécifiez la rubrique suivante ayant le indiqué «identifiant"Et justifiez-le au centre en utilisant le"" étiqueter. Ajoutez également un «onduir”Événement avec la fonction spécifiée. Cela entraînera l'accès à la fonction Access () lors du plan de la souris sur la rubrique spécifiée:

Ceci est un site Web

Maintenant, déclarez la fonction nommée «accès()". Dans sa définition, récupérez le cap inclus en utilisant le «document.getElementByid ()" méthode. Après cela, appliquez le «texte de texte”Propriété pour transformer la rubrique déjà spécifiée à la mise à jour sur le plan de la souris comme suit:

Fonction Access ()
var get = document.getElementByid ('tête')
obtenir.innerText = "Linuxhint"

Sortir

Nous avons compilé le concept d'application du profileur JavaScript à divers algorithmes de code et avons noté le temps consommé contre chacun d'eux.

Conclusion

Le profileur JavaScript peut être appliqué sur le «changer»Déclaration avec les boîtes de dialogue invite et alerte ou sur le« sur le «fonction spécifiée". D'après la mise en œuvre discutée, on peut observer que cette dernière approche consomme relativement moins de temps que la première approche. Cet article a démontré la mise en œuvre du profileur JavaScript sur les différentes fonctionnalités.