Neu in den DevTools, Chrome 133

Sofia Emelianova
Sofia Emelianova
GitHub

Persistenter KI-Chatverlauf

Im Bereich KI-Unterstützung wird Ihr Chatverlauf jetzt lokal über Sitzungen hinweg gespeichert. So können Sie Ihre bisherigen Unterhaltungen mit Gemini auch nach dem Neuladen der Entwicklertools oder von Chrome aufrufen.

Verbesserungen am Bereich „Leistung“

Diese Version enthält eine Reihe von Verbesserungen am Bereich Leistung.

Statistik zur Bildübermittlung

Auf dem Tab Leistung > Statistiken werden jetzt Bilder hervorgehoben, deren Dateigröße Sie optimieren können. Klicken Sie auf ein Bild in der Statistik, um es im Track Netzwerk hervorgehoben zu sehen.

Der Bereich „Leistung“ mit der hervorgehobenen Statistik zur Bildauslieferung

Weitere Informationen zur Optimierung der Bildübermittlung finden Sie unter Bilder effizient codieren.

Klassische und moderne Tastaturnavigation

Im Bereich Leistung können Sie jetzt die gewünschte Tastaturnavigation auswählen. Dabei gibt es die folgenden Hauptunterschiede:

  • Klassisch: Zoomen Sie mit dem Mausrad (Touchpad nach oben oder unten) und scrollen Sie vertikal mit der Umschalttaste + Mausrad.
  • Modern: Vertikales Scrollen mit dem Mausrad, horizontales Scrollen mit Umschalttaste + Mausrad und Zoomen mit Befehlstaste/Strg + Mausrad.

Wenn Sie den gewünschten Stil auswählen möchten, klicken Sie rechts oben im Steuerfeld auf Tastenkürzel anzeigen und wählen Sie Klassisch oder Modern aus. Im Dialogfeld „Tastenkürzel“ finden Sie auch eine Übersicht über die verfügbaren Tastenkürzel.

Das Dialogfeld mit den verfügbaren Tastenkürzeln für den Bereich „Leistung“.

Irrelevante Scripts im Flammendiagramm ignorieren

Damit Sie sich besser auf Ihren Code konzentrieren können, können Sie irrelevante Scripts jetzt direkt im Bereich Leistung der Ignorierliste hinzufügen. Zu viel verschachtelte Elemente werden automatisch minimiert.

Wenn Sie der Ignorierliste Scripts hinzufügen möchten, klicken Sie oben in der Aktionsleiste auf Dialogfeld für die Einstellung der Ignorierliste anzeigen und geben Sie einen regulären Ausdruck in das Eingabefeld ein. Im Flammendiagramm wird die neue Regel während der Eingabe angewendet.

In DevTools werden die Regeln für die Ausblendungsliste gespeichert, die Sie unter Einstellungen > Ausblendungsliste hinzufügen. Sie können sie im Dialogfeld nach Belieben aktivieren und deaktivieren.

Zeitachsenmarkierungen und -bereiche werden beim Bewegen des Mauszeigers hervorgehoben

Im Bereich Leistung können Sie die Leistungsaufzeichnung jetzt noch besser nachvollziehen.

  • Wenn Sie den Mauszeiger auf die Zeitachse bewegen, wird eine vertikale Markierung angezeigt, die den gesamten Leistungsverlauf umfasst.
  • Ein Bereich in der Zeitachse wird hervorgehoben, wenn du den Mauszeiger auf Elemente im Haupt-Track bewegst.

Empfohlene Einstellungen für die Drosselung

Im Bereich Leistung werden jetzt sowohl in den Livemesswerten als auch in den Drop-down-Menüs Aufnahmeeinstellungen Einstellungen für die Drosselung empfohlen.

Die Einstellungsmenüs vor und nach dem Hinzufügen von Empfehlungen zur Drosselung.

Die empfohlene CPU-Drosselung ist (derzeit) die am häufigsten verwendete 4x slowdown. Die Netzwerkempfehlung basiert auf Daten aus dem Chrome UX-Bericht, sofern dieser in den Live-Messwerten aktiviert ist.

Außerdem werden Ihnen im Bereich Leistung jetzt die von Ihnen verwendeten Drosselungseinstellungen neben jedem Trace im Drop-down-Menü Letzte Sitzungen in der Aktionsleiste angezeigt.

Zeitmarkierungen in einem Overlay

Die Zeitgeber-Markierungen wurden aus dem Zeitgeber-Track an den unteren Rand des Tracings verschoben. Sie werden jetzt über allen Tracks eingeblendet und sind auch dann sichtbar, wenn der Zeitgeber-Track ausgeblendet ist.

Vor und nach dem Verschieben von Markierungen ans Ende des Positionsverlaufs

Im Timings-Track werden Ihre benutzerdefinierten mark()- und measure()-Aufrufe aufbewahrt.

Stack-Traces von JavaScript-Aufrufen in der Zusammenfassung

Auf dem Tab Leistung > Zusammenfassung werden jetzt Stack-Traces von JavaScript-Aufrufen angezeigt, einschließlich asynchroner Aufrufe.

Vor und nach dem Hinzufügen von Stack-Traces zum Tab „Zusammenfassung“

Kennzeicheneinstellungen wurden in Elements ins Menü verschoben

Die Einstellungen für Logos im Bereich Elemente wurden aus einer standardmäßig ausgeblendeten Aktionsleiste in das entsprechende Menü für Rechtsklicks verschoben.

Vor und nach dem Verschieben der Badge-Einstellungen in das Menü

Neuer Bereich „Das ist neu“

Der Bereich Neue Funktionen hat ein neues Design, das dem von Chrome näher entspricht.

Das alte und neue Design des Bereichs „Neue Funktionen“.

Chromium-Problem: 325441858.

Lighthouse 12.3.0

Im Bereich Lighthouse wird jetzt Lighthouse 12.3.0 ausgeführt.

Dieses Update enthält unter anderem neue Prüfungen, die die korrekte Isolation des Ursprungs mit COOP und einer wirkungsvollen HSTS-Richtlinie prüfen. Vollständige Liste der Änderungen

Informationen zu den Grundlagen der Verwendung des Lighthouse-Steuerfelds in den DevTools finden Sie unter Lighthouse: Websitegeschwindigkeit optimieren.

Chromium-Problem: 40543651.

Sonstige Highlights

Hier sind einige wichtige Fehlerkorrekturen und Verbesserungen in dieser Version:

  • Quellen: Wenn der Debugger pausiert ist, wechselt er jetzt nicht mehr unerwartet zum Service Worker-Kontext, wenn dieser nach der Pause erstellt wird (373893057).
  • Leistung:
    • Wenn Sie den Mauszeiger auf Scripts bewegen, werden im Flammendiagramm jetzt gegebenenfalls URLs angezeigt (368541957).
    • Zusammenfassung: Das Tortendiagramm wird durch eine Balkendarstellung ersetzt.
    • Das Kästchen Erweiterungsdaten in den Aufnahmeeinstellungen wurde in Benutzerdefinierte Tracks anzeigen umbenannt.
    • Der Tab Statistiken enthält jetzt den Abschnitt Überprüfte Statistiken (N), der standardmäßig minimiert ist.
  • Anwendung > Speicher: Sie können Speichereinträge mit leeren Schlüsseln erstellen, da diese technisch gültig sind (373703285).
  • Der Gerätemodus ist jetzt für chrome://-Seiten deaktiviert (40186276).
  • Netzwerk:
    • Wenn die entsprechende Einstellung aktiviert ist, öffnet sich durch einmaliges Klicken auf HAR exportieren ein Menü mit zwei Optionen (bereinigt und mit sensiblen Daten). Bisher wurde das Menü durch ein langes Drücken geöffnet (378076279).
    • Bei Als cURL kopieren wird jetzt das Attribut „-b“ verwendet, um Cookies zu umgehen und die Lesbarkeit zu verbessern, anstelle von -H 'cookie:...' (40791742).
  • Bedienungshilfen: Tabs in Steuerfeldern können jetzt über ein Kontextmenü nach links oder rechts verschoben werden (383164782).
  • Blockierung der Netzwerkanfrage: Diese Einstellung im Menü „Befehl“ ist jetzt mit dem entsprechenden Kästchen (378058733) synchronisiert.

Vorschaukanäle herunterladen

Verwenden Sie als Standard-Entwicklungsbrowser Chrome Canary, Chrome Dev oder Chrome Beta. Diese Vorabversionen bieten Zugriff auf die neuesten DevTools-Funktionen, ermöglichen den Test moderner Webplattform-APIs und helfen Ihnen, Probleme auf Ihrer Website zu finden, bevor Ihre Nutzer sie bemerken.

Chrome-Entwicklertools-Team kontaktieren

Über die folgenden Optionen können Sie sich über neue Funktionen, Updates oder andere Themen im Zusammenhang mit den DevTools austauschen.

Neu in den DevTools

Eine Liste aller Themen, die in der Reihe Neu in den DevTools behandelt wurden.