Freigeben über


Messen der Laufzeitleistung einer Seite mit dem Leistungsmonitortool

Verwenden Sie das Systemmonitortool , um eine Echtzeitansicht der Laufzeitleistung einer Webseite zu erhalten.

Mit dem Systemmonitor-Tool können Sie ermitteln, woher Leistungsprobleme kommen. Es gibt verschiedene Gründe, warum eine Website langsam ausgeführt werden kann. Dieses Tool liefert Hinweise, um zu verstehen, ob die Probleme mit ursachen wie den folgenden zusammenhängen:

  • Hohe Arbeitsspeicher- oder CPU-Auslastung.
  • Zu häufige Layout- und Stilberechnungen.
  • Zu viele DOM-Knoten und Ereignislistener.

Öffnen des Tools für die Leistungsüberwachung

So öffnen Sie das Tool für die Leistungsüberwachung :

  1. Klicken Sie zum Öffnen von DevTools mit der rechten Maustaste auf die Webseite, und wählen Sie dann Untersuchen aus. Oder drücken Sie STRG+UMSCHALT+I (Windows, Linux) oder BEFEHL+WAHL+I (macOS). DevTools wird geöffnet.

  2. Wählen Sie in DevTools auf der Aktivitätsleiste die Registerkarte Leistungsmonitor aus . Wenn diese Registerkarte nicht angezeigt wird, klicken Sie auf die Schaltfläche Weitere Tools (Symbol weitere Tools):

Menü

Der Leistungsmonitor zeigt Diagramme verschiedener Leistungsmetriken an, die in Echtzeit aktualisiert werden:

So sieht das Systemmonitortool beim ersten Öffnen aus

Auswählen der zu überwachenden Leistungsmetriken

Das Leistungsmonitortool zeigt standardmäßig drei Leistungsmetriken an, und zusätzliche Metriken sind verfügbar.

Leistungsmetrik Beschreibung
CPU-Auslastung Der Prozentsatz der cpu-Auslastung durch die Webseite. Standardmäßig angezeigt.
JS-Heapgröße Die Menge an Arbeitsspeicher, die vom JavaScript-Programm auf der Seite verwendet wird. Standardmäßig angezeigt.
DOM-Knoten Die Anzahl der DOM-Knoten im Browser (registerkartenübergreifend). Standardmäßig angezeigt.
JS-Ereignislistener Die Anzahl der JavaScript-Ereignislistener im Browser (registerkartenübergreifend).
Documents Die Anzahl der Dokumentobjekte im Browser (registerkartenübergreifend).
Dokumentrahmen Die Anzahl der Dokumentframes im Browser (registerkartenübergreifend).
Layouts/Sekunde Die Anzahl der Male pro Sekunde, die die Browser-Engine das Layout der Seite erstellt.
Neuberechnungen von Formatvorlagen/Sekunde Die Anzahl der Male pro Sekunde, die das Browsermodul den CSS-Stil der Seite berechnet.

Um die verfügbaren Leistungsmetriken zu aktivieren oder zu deaktivieren, klicken Sie auf die Bezeichnungen in der Randleiste:

Die Randleiste des Leistungsmonitors mit verschiedenen Metriken, die umgeschaltet werden können