/ / Profilage des applications jQuery - javascript, jquery, profiling, performance

Profilage d'applications jQuery - javascript, jquery, profiling, performance

Je suis récemment tombé sur une réponse lentebug de script sur une application et j'ai ressenti le besoin de profiler l'application pour identifier ce que je devais améliorer. Je veux une solution à long terme, pas une solution hackish. J'ai essayé le Firebug Profiler mais comme l'application utilise beaucoup de jQuery, je reçois beaucoup de rapports sur les appels anonymes auxquels je m'attendais réellement.

J'ai également trouvé sur le Web des informations sur un profileur créé par John Resig mais les liens que j'ai trouvés étaient tous morts.

Donc mes questions sont:

  1. Quelles sont les meilleures façons de profiler une application jQuery?
  2. Existe-t-il des outils / scripts dédiés open source pour y parvenir?

Réponses:

1 pour la réponse № 1

Donc, après avoir creusé un peu plus, j'ai trouvé une autre solution donnée par John Resig. Il utilisait une extension de test unitaire pour firebug appelée FireUnit (http://fireunit.org/) qui se révèle assez agréable.

Si vous regardez les exemples donnés à:

http://ejohn.org/blog/function-call-profiling/

Et consultez également la page de test qu'il propose:

http://ejohn.org/files/jquery-profile.html

Vous obtenez de bons résultats tels que ci-dessous:

.addClass ("test"); 52
.addClass ("test"); 102
.removeClass ("test"); 102
.removeClass ("test"); 52
.css ("couleur", "rouge"); 299 O (3n)
.css ({couleur: "rouge", bordure: "1px rouge uni"}); 597 O (6n)
.retirer(); 198 O (2n)
.append ("test"); 599 O (6n)
.spectacle(); 982 O (10n)
.cacher(); 968 O (10n)
.html ("test"); 104
.vide(); 100
.is ("div"); 109
.filter ("div"); 214 O (2n)
.find ("div"); 300 O (3n)

J'ai réussi à intégrer cela dans plusieursapplications et les résultats ont été plus que satisfaisants. Le seul inconvénient est que vous ne pouvez utiliser le plugin qu'à partir de Firefox. Mais c'est quand même un bel outil.


0 pour la réponse № 2

Comme indiqué ici :

IE, Chrome et Safari ont intégré des profileurs dansle développement web outils fournis avec le navigateur. Pour Firefox, vous pouvez utiliser Firebug. Peut également être utile, car vous utilisez jQuery, ce qui signifie que votre le rapport de profilage sera rempli de fonctions anonymes et similaires, ce qui le rend tout à fait illisible, Profilage jQuery de John Resig brancher, Qui va vous donner une sortie plus claire sur la question.


0 pour la réponse № 3

J'ai créé un outil qui fait exactement ce dont vous avez besoin: http://yellowlab.tools

Lancez un test, cliquez sur l'onglet "JS Timeline" etil enregistre toutes les fonctions jQuery qui accèdent au DOM lors du chargement de la page. Il suit également les fonctions JS de vanille, afin que vous puissiez comprendre la magie derrière jQuery.

Très utile pour aider à optimiser le code jQuery pour les performances.

J'espère que ma réponse ne vient pas trop tard :)