Profilerstellung für jQuery-Anwendungen - Javascript, jQuery, Profilerstellung, Leistung

Ich bin kürzlich auf eine langsame Reaktion gestoßenSkriptfehler in einer Anwendung und ich hatte das Bedürfnis, die Anwendung zu profilieren, um zu identifizieren, was ich verbessern muss. Ich möchte eine langfristige Lösung, keine hackische Lösung. Ich habe den Firebug Profiler ausprobiert, aber da die Anwendung viel jQuery verwendet, erhalte ich viele Berichte über anonyme Anrufe, die ich eigentlich erwartet hatte.

Ich habe im Internet auch einige Berichte über einen von John Resig erstellten Profiler gefunden, aber die Links, die ich gefunden habe, waren alle tot.

Also meine Fragen sind:

1. Wie kann eine jQuery-Anwendung am besten profiliert werden?
2. Gibt es spezielle OpenSource-Tools / -Skripte, um dies zu erreichen?

Antworten:

1 für die Antwort № 1

Nachdem ich ein bisschen mehr ausgegraben hatte, fand ich eine andere Lösung von John Resig. Er verwendete eine Unit-Testing-Erweiterung für den Firebug namens FireUnit (http://fireunit.org/), die sich als recht nett herausstellte.

Schauen Sie sich die Beispiele an:

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

Überprüfen Sie auch die Testseite, die er bereitstellt:

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

Was Sie bekommen, sind einige schöne Ergebnisse wie unten:

.addClass ("test"); 52
.addClass ("test"); 102
.removeClass ("test"); 102
.removeClass ("test"); 52
CSS ("Farbe", "rot"); 299 O (3n)
.css ({Farbe: "rot", Rand: "1px durchgehend rot"}); 597 O (6n)
.entfernen(); 198 O (2n)
.append ("test"); 599 O (6n)
.Show(); 982 O (10n)
.ausblenden(); 968 O (10n)
.html ("test"); 104
.leeren(); 100
.is ("div"); 109
.filter ("div"); 214 O (2n)
.find ("div"); 300 O (3n)

Ich habe es geschafft, dies in mehrere zu integrierenAnwendungen und die Ergebnisse waren mehr als zufriedenstellend. Der einzige Nachteil ist, dass Sie das Plugin nur in Firefox verwenden können. Trotzdem ist dies ein ziemlich schönes Werkzeug.

---

0 für die Antwort № 2

Wie angegeben Hier :

IE, Chrome und Safari haben integrierte Profilerdie Webentwicklung Tools, die mit dem Browser geliefert werden. Für Firefox können Sie Firebug verwenden. Auch nützlich sein kann, da Sie jQuery verwenden, was bedeutet, Ihre Der Profilerstellungsbericht wird mit anonymen Funktionen gefüllt sein, es ziemlich unlesbar machen, JQuery-Profilerstellung von John Resig Plugin, welches wird geben Sie eine klarere Ausgabe auf der Angelegenheit.

---

0 für die Antwort № 3

Ich habe ein Tool erstellt, das genau das tut, was Sie brauchen: http://yellowlab.tools

Starten Sie einen Test, klicken Sie auf die Registerkarte "JS Timeline" undEs protokolliert alle jQuery-Funktionen, die während des Ladens der Seite auf das DOM zugreifen. Außerdem werden die Vanille-JS-Funktionen nachverfolgt, sodass Sie die Magie hinter jQuery verstehen.

Sehr nützlich, um etwas jQuery-Code für die Leistung zu optimieren.

Hoffe meine Antwort kommt nicht zu spät :)

---