Funktionspezifische Leistungsprofilerstellung ⇐ JavaScript

[Anonymous]

gibt es einen Weg in Chrom oder Firefox, die Ausführungszeit einer bestimmten Funktion (und die von ihm aufgerufenen Funktionen) genau zu profilieren. Für den Kontext schreibe ich einen benutzerdefinierten Renderer für eine App, an der ich arbeite, und versuche, die Zeit für den Rahmen so weit wie möglich zu minimieren, um FPS zu maximieren. Der Renderer zeichnet direkt auf eine HTML -Leinwand. src = "https://i.sstatic.net/3accw1ld.png"/>
Danach, vorausgesetzt, ich lese sie richtig, und Firefox sagt mir, dass meine Funktion _Draw ~ 2 ms zur Ausführung (313 ms/157 Samples) nimmt. Wenn ich jedoch eine einfache Benchmark-Funktion wie folgt erstelle: < /p>

Code: Select all

bench(): void {
const iterations = 10_000;
const start = performance.now();
for (let i = 0; i < iterations; i++) {
this._draw();
}
const end = performance.now();
const time = end - start;
const perCallTime = time / iterations;
console.log("Time: ", time, "ms", "Per call: ", perCallTime, "ms");
}

Ich erhalte dies in meiner Konsole:

Die Methode, die diese Art und; wird auf dem Bildschirm jedes Mal, wenn die Zeichnungsfunktion aufgerufen wird, sehr ähnlich. Ich erhalte, das die Ergebnisse ändern könnte, aber nicht um eine ganze Größenordnung. Wie würde ich das richtig profilieren? Idealerweise möchte ich nicht nur die Ausführungszeit auf der obersten Ebene auf der Hauptabzugsfunktion, sondern die Ausführungszeit pro Funktion, die darin genannt wird wie ein Flamgraph. Der Flamegraph führt zu Firefox zeigen die gleichen Ergebnisse wie die Registerkarte "Call Tree".