Verbesserungen am Netzwerkbereich
In dieser Version wurden einige Verbesserungen im Bereich Netzwerk vorgenommen.
Neu gestaltete Netzwerkfilter
Der Bereich Netzwerk wurde anhand deines Feedbacks überarbeitet und enthält jetzt neue Filter. Die typspezifischen Filter bleiben gleich: eine Reihe von Logos in einer übersichtlichen Leiste für die Mehrfachauswahl.
Um die Benutzeroberfläche übersichtlicher zu gestalten, werden die Kästchen zum Ausblenden, Blockieren und für Drittanbieter in eine Drop-down-Liste verschoben. Die Liste enthält eine Zahl, die angibt, wie viele Filter im Drop-down-Menü ausgewählt sind.
Wenn Sie wieder das alte Filterdesign verwenden möchten, entfernen Sie das Häkchen aus den
Einstellungen > Tests > Design der Filterleiste im Steuerfeld „Netzwerk“.Wir freuen uns auf Ihr Feedback zum neuen Design.
Chromium-Problem: 362672528.
Sensible Daten werden bei HAR-Exporten jetzt standardmäßig ausgeschlossen
Um das Risiko versehentlicher Datenlecks zu verringern, enthält das im HAR-Format exportierte Netzwerkprotokoll standardmäßig keine Cookie
-, Set-Cookie
- und Authorization
-Header mehr.
Wenn Sie Protokolle im HAR-Format mit den sensiblen Daten exportieren möchten, aktivieren Sie
Einstellungen > Einstellungen > Netzwerk > Generierung von HAR mit sensiblen Daten zulassen. Im Bereich Netzwerk wird die Schaltfläche Exportieren mit einem Pfeil markiert. Halten Sie die Schaltfläche gedrückt und wählen Sie im Drop-down-Menü HAR (mit sensiblen Daten) exportieren aus.Chromium-Problem: 361717594.
Verbesserungen im Bereich „Elemente“
Diese Version enthält eine Reihe von Verbesserungen für den Bereich Elemente.
Autocomplete-Werte für text-emphasis-*
-Properties
Die automatische Vervollständigung auf dem Tab Styles schlägt jetzt Werte für die folgenden CSS-Properties vor:
Chromium-Problem: 361471205.
Scroll-Überlauf mit Kennzeichen
Im Bereich Elemente werden jetzt Elemente, die überlaufende Inhalte enthalten und overflow: scroll
oder overflow: auto
haben, mit einem neuen Symbol „Scrollen“ gekennzeichnet. So können Sie Überlaufbereiche beim Scrollen leichter erkennen. Wie die anderen Logos spiegelt auch dieses Logo das aktuelle DOM wider und verschwindet, wenn der Inhalt z. B. aufgrund einer Größenänderung nicht mehr überläuft.
Chromium-Problem: 40670442.
Leere Deklarationen nach verschachtelten Regeln werden nicht nach oben verschoben
Gemäß der Entscheidung der CSS-Arbeitsgruppe, nackte Deklarationen nach verschachtelten Regeln zuzulassen, werden diese Deklarationen auf dem Tab Stile beim Parsen nicht mehr nach oben verschoben.
Im folgenden Codebeispiel führt die einfache Deklaration nach der verschachtelten Regel nicht dazu, dass Chrome die Stile in der Kaskaden unerwartet neu sortiert:
p {
width: 100px;
height: 100px;
@media screen {
background-color: red;
}
background-color: green;
}
Chromium-Problem: 358119261.
Verbesserungen am Bereich „Leistung“
In dieser Version wurden im Bereich Leistung einige Verbesserungen vorgenommen.
Empfehlungen in Live-Messwerten
Livemesswerte bieten jetzt messwertspezifische Empfehlungen, mit denen Sie Ihre Entwicklungsumgebung so konfigurieren können, dass sie der Nutzererfahrung entspricht.
Wenn Sie Empfehlungen erhalten möchten, richten Sie den Abruf von Felddaten aus dem Chrome UX Report (CrUX) ein. Maximieren Sie auf jeder Messwertkarte den Abschnitt Bedingungen für lokale Tests berücksichtigen (falls vorhanden) und Umgebungseinstellungen.
Folgen Sie den Empfehlungen, um die Nutzererfahrung zu simulieren.
Navigationspfad verwenden
Sie können jetzt auf der Zeitachse einer Leistungsaufzeichnung mit Navigationspfaden navigieren: Sie können zwischen Navigationspfaden hin- und herspringen, untergeordnete Navigationspfade überschreiben und mehrere untergeordnete Breadcrumbs entfernen. Bisher wurden die untergeordneten Elemente ausgeblendet, wenn Sie ein übergeordnetes Navigationselement ausgewählt haben.
Verbesserungen des Arbeitsspeicher-Bereichs
Diese Version umfasst eine Reihe von Verbesserungen im Bereich Arbeitsspeicher.
Neues Profil „Getrennte Elemente“
Im Bereich Speicher gibt es einen neuen Profiltyp: Losgelöste Elemente. Sie zeigt Objekte, die von einer JavaScript-Referenz beibehalten werden.
Chromium-Problem: 350519222.
Verbesserte Benennung von einfachen JS-Objekten
Um die Kategorie Object
in Heap-Snapshots zu organisieren und zu übersichtlich gestalten, werden einfache JavaScript-Objekte jetzt so dargestellt:
- Sie werden anhand der enthaltenen Properties benannt, z. B.
{firstProperty, secondProperty, ..., *nthProperty}
. - Es kann nach diesen Namen gesucht werden, die von DevTools erstellt werden.
- Werden gruppiert, wenn sie dieselben Properties haben.
Chromium-Problem: 350519222.
Dynamisches Design deaktivieren
Du kannst jetzt den automatischen Abgleich der Farben in den Entwicklertools mit deinen benutzerdefinierten Designfarben in Chrome deaktivieren.
Wenn Sie die dynamische Themenauswahl deaktivieren möchten, entfernen Sie das Häkchen bei
Einstellungen > Einstellungen > Darstellung > Chrome-Farbschema verwenden und laden Sie die DevTools neu.Chromium-Problem: 328472696.
Chrome-Experiment: Prozessfreigabe
Normalerweise erstellt Chrome für jeden Tab, den Sie von derselben Website (z. B. Google Docs) öffnen, einen separaten Renderer-Prozess. Beim Test Prozessfreigabe wird dies geändert, indem mehrere Tabs denselben Renderer-Prozess nutzen können, um die Leistung zu verbessern.
Wenn Sie in den Entwicklertools die Infoleiste „Dieser Tab teilt Ressourcen mit anderen Tabs…“ sehen, gehören Sie zu der kleinen Gruppe, für die der Test zur Prozessfreigabe aktiviert ist.
Die Prozessfreigabe kann das Debugging von Haltepunkten und die Leistungsanalyse beeinflussen. Weitere Informationen finden Sie im Hilfeartikel Chrome-Test: Prozessfreigabe.
Lighthouse 12.2.1
Im Steuerfeld Lighthouse wird jetzt Lighthouse 12.2.1 ausgeführt.
Mit diesem Update wird ein < 20 KB
Ignoriergrenzwert für Vorschläge zur Komprimierung von Ressourcen eingeführt, damit Sie sich nur auf die sinnvollen Einsparungen bei der Dateigröße konzentrieren können. Eine vollständige Liste der Änderungen finden Sie hier.
Informationen zu den Grundlagen der Verwendung des Lighthouse-Steuerfelds in den DevTools finden Sie unter Lighthouse: Websitegeschwindigkeit optimieren.
Chromium-Problem: 772558
Sonstige Highlights
Im Folgenden sind einige bemerkenswerte Fehlerbehebungen und Verbesserungen in dieser Version aufgeführt:
- Elemente:
- Konsole: Es wurde ein nicht entkommentiertes Andzeichen in mehrzeiligen Strings in cURL-Befehlen behoben (352651673).
- Speicher: Die Standardauswahl auf Seiten mit Dienst-Workern wurde korrigiert. Der Haupt-Thread wird jetzt ausgewählt (40669896).
- Sicherheit: Die URL-Schemahervorhebung wird jetzt korrekt aktualisiert, wenn sich die Sicherheitsphase eines Ursprungs ändert (359920086).
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
Mit den folgenden Optionen können Sie über neue Funktionen, Updates oder andere Themen im Zusammenhang mit den DevTools sprechen.
- Senden Sie uns Feedback und Funktionsanfragen unter crbug.com.
- Wenn du ein Problem mit den Entwicklertools melden möchtest, klicke in den Entwicklertools auf Weitere Optionen > Hilfe > Entwicklertools-Problem melden.
- Tweeten Sie an @ChromeDevTools.
- Hinterlassen Sie Kommentare unter den YouTube-Videos zu den Neuigkeiten in den DevTools oder den YouTube-Videos mit Tipps zu den DevTools.
Neu in den DevTools
Eine Liste aller Themen, die in der Reihe Was ist neu in den DevTools? behandelt wurden.
- CSS-Fehler mit Gemini beheben
- KI-Funktionen über einen eigenen Tab „Einstellungen“ steuern
- Verbesserungen im Bereich „Leistung“
- Leistungsergebnisse annotieren und teilen
- Leistungsstatistiken direkt im Bereich „Leistung“ abrufen
- Übermäßige Layoutänderungen leichter erkennen
- Nicht zusammengesetzte Animationen erkennen
- Gleichzeitigkeit der Hardware wird auf Sensoren umgestellt
- Ignoriere anonyme Skripts und konzentriere dich auf deinen Code in Stacktraces
- „Elemente“ > „Stile“: Unterstützung für Schreibmodi im Querformat für Raster-Overlays und CSS-weite Keywords
- Lighthouse-Audits für Nicht-HTTP-Seiten im Zeitraum- und Snapshot-Modus
- Verbesserte Bedienungshilfen
- Sonstige Highlights
- Verbesserungen am Netzwerkbereich
- Neu konzipierte Netzwerkfilter
- Sensible Daten werden bei HAR-Exporten jetzt standardmäßig ausgeschlossen
- Verbesserungen im Bereich „Elemente“
- Autocomplete-Werte für text-emphasis-*-Properties
- Scroll-Overflows mit einem Symbol gekennzeichnet
- Verbesserungen am Bereich „Leistung“
- Empfehlungen in Live-Messwerten
- Navigationspfade
- Verbesserungen am Bereich „Speicher“
- Neues Profil „Getrennte Elemente“
- Verbesserte Benennung von einfachen JS-Objekten
- Dynamische Themen deaktivieren
- Chrome-Experiment: Prozessfreigabe
- Lighthouse 12.2.1
- Verschiedene Highlights
- Der Rekorder unterstützt den Export nach Puppeteer für Firefox
- Verbesserungen im Bereich „Leistung“
- Beobachtungen zu Live-Messwerten
- Suchanfragen im Netzwerk-Track
- Stacktraces von „performance.mark“- und „performance.measure“-Aufrufe ansehen
- Testadressdaten im Autofill-Bereich verwenden
- Verbesserungen im Bereich „Elemente“
- Weitere Status für bestimmte Elemente erzwingen
- Unter „Elemente“ > „Stile“ werden jetzt mehr Rastereigenschaften automatisch vervollständigt
- Lighthouse 12.2.0
- Verschiedene Highlights
- Console Insights von Gemini wird in den meisten europäischen Ländern eingeführt
- Änderungen am Bereich „Leistung“
- Erweiterter Netzwerk-Track
- Leistungsdaten mit der Extensibility API anpassen
- Details im Timing-Track
- Alle aufgeführten Anfragen im Netzwerkbereich kopieren
- Schnellere Heap-Snapshots mit benannten HTML-Tags und weniger Unordnung
- Animationsbereich öffnen, um Animationen aufzunehmen und @keyframes live zu bearbeiten
- Lighthouse 12.1.0
- Verbesserungen bei der Barrierefreiheit
- Verschiedene Highlights
- CSS-Ankerposition im Steuerfeld „Elemente“ prüfen
- Verbesserungen im Bereich „Quellen“
- Verbesserte Funktion „Hier nie pausieren“
- Neue Listener für Scroll-Snap-Ereignisse
- Verbesserungen im Netzwerkbereich
- Aktualisierte Voreinstellungen für die Netzwerkdrosselung
- Service Worker-Informationen in benutzerdefinierten Feldern des HAR-Formats
- WebSocket-Ereignisse im Bereich „Leistung“ senden und empfangen
- Sonstige Highlights
- Verbesserungen am Bereich „Leistung“
- Tracks mit dem aktualisierten Konfigurationsmodus für Tracks verschieben und ausblenden
- Scripts im Flammendiagramm ignorieren
- CPU um das 20-Fache drosseln
- Der Bereich „Leistungsstatistiken“ wird eingestellt
- Übermäßige Arbeitsspeichernutzung mit neuen Filtern in Heap-Snapshots erkennen
- Storage-Buckets unter „Anwendung“ > „Speicher“ prüfen
- Warnungen zu Self-XSS mit einem Befehlszeilen-Flag deaktivieren
- Lighthouse 12.0.0
- Verschiedene Highlights
- Fehler und Warnungen in der Console mit Gemini besser nachvollziehen
- Unterstützung für @position-try-Regeln unter „Elemente“ > „Stile“
- Verbesserungen im Bereich „Quellen“
- Automatisches Ansprechen des Drucks und Schließen von Klammern konfigurieren
- Abgelehnte Versprechen, die verarbeitet wurden, werden als erkannt erkannt.
- Fehlerursachen in der Console
- Verbesserungen am Netzwerkbereich
- Header „Early Hints“ prüfen
- Wasserfall-Spalte ausblenden
- Verbesserungen am Bereich „Leistung“
- CSS-Selektorstatistiken erfassen
- Reihenfolge ändern und Titel ausblenden
- Retainer im Bereich „Arbeitsspeicher“ ignorieren
- Lighthouse 11.7.1
- Verschiedene Highlights
- Neues Autofill-Steuerfeld
- Erweiterte Netzwerkdrosselung für WebRTC
- Unterstützung für scrollbare Animationen im Bereich „Animationen“
- Verbesserte Unterstützung für CSS-Verschachtelung unter „Elemente“ > „Stile“
- Bereich „Erweiterte Leistung“
- Funktionen und ihre untergeordneten Elemente im Flammendiagramm ausblenden
- Pfeile von ausgewählten Initiatoren zu von ihnen initiierten Ereignissen
- Lighthouse 11.6.0
- Tooltips für spezielle Kategorien unter „Speicher“ > „Heap-Snapshots“
- Anwendung > Speicherupdates
- Für den freigegebenen Speicherplatz verwendete Bytes
- Web SQL wurde vollständig eingestellt
- Verbesserungen des Abdeckungsbereichs
- Das Steuerfeld „Ebenen“ wird möglicherweise eingestellt
- Einstellung des JavaScript-Profilers: Phase 4, finale Phase
- Verschiedene Highlights
- Finde das Easter Egg
- Aktualisierungen des Steuerfelds „Elemente“
- Fokussierte Seite unter „Elemente“ > „Stile“ emulieren
- Farbauswahl, Winkeluhr und Ease-In-Editor in
var()
-Fallbacks - Tool „CSS-Länge“ wurde eingestellt
- Pop-up-Fenster für das ausgewählte Suchergebnis unter „Leistung“ > „Haupt-Track“
- Änderungen am Bereich „Netzwerk“
- Schaltfläche „Löschen“ und Suchfilter unter „Netzwerk“ > Tab „EventStream“
- Tooltips mit Gründen für Ausnahmen für Drittanbieter-Cookies unter „Netzwerk“ > „Cookies“
- Alle Haltepunkte unter „Quellen“ aktivieren und deaktivieren
- Geladene Scripts in den DevTools für Node.js ansehen
- Lighthouse 11.5.0
- Verbesserungen bei der Barrierefreiheit
- Sonstige Highlights
- Die offizielle Sammlung von Rekorder-Erweiterungen ist jetzt verfügbar
- Netzwerkverbesserungen
- Fehlerursache in der Spalte „Status“
- Verbessertes Untermenü „Kopieren“
- Leistungsverbesserungen
- Navigationspfade in der Zeitachse
- Initiatoren von Ereignissen im Haupt-Track
- Menü zur Auswahl von JavaScript-VM-Instanzen für Node.js-Entwicklertools
- Neuer Befehl und neuer Kurzbefehl unter „Quellen“
- Verbesserungen bei Elementen
- Das Pseudoelement „::view-transition“ kann jetzt in „Stile“ bearbeitet werden
- Unterstützung des Attributs „align-content“ für Blockcontainer
- Unterstützung des Sicherheitsstatus für emulierte faltbare Geräte
- Dynamische Themen
- Warnungen zur Einstellung von Drittanbieter-Cookies im Bereich „Netzwerk“ und „Anwendung“
- Lighthouse 11.4.0
- Verbesserungen bei der Barrierefreiheit
- Verschiedene Highlights
- Verbesserungen der Elemente
- Optimierte Filterleiste im Bereich „Netzwerk“
@font-palette-values
-Support- Unterstützter Fall: Benutzerdefinierte Eigenschaft als Fallback einer anderen benutzerdefinierten Eigenschaft
- Verbesserte Unterstützung von Quellzuordnungen
- Verbesserungen im Bereich „Leistung“
- Track „Erweiterte Interaktionen“
- Erweiterte Filter auf den Tabs „Bottom-up“, „Aufrufstruktur“ und „Ereignisprotokoll“
- Einzugsmarkierungen im Bereich „Quellen“
- Hilfreiche Kurzinfos zu überschriebenen Headern und Inhalten im Steuerfeld „Netzwerk“
- Neue Optionen im Befehlsmenü zum Hinzufügen und Entfernen von Blockierungsmustern für Anfragen
- Der Test für CSP-Verstöße wird entfernt
- Lighthouse 11.3.0
- Verbesserungen bei der Barrierefreiheit
- Sonstige Highlights
- Einstellung von Drittanbieter-Cookies
- Cookies Ihrer Website mit dem Privacy Sandbox Analysis Tool analysieren
- Erweitertes Ignorieren von Listen
- Standardausschlussmuster für node_modules
- Wenn eine Ausnahme abgefangen wird oder nicht ignorierten Code passiert, wird die Ausführung jetzt beendet.
x_google_ignoreList
in Quellzuordnungen inignoreList
umbenannt- Neue Ein/Aus-Schaltfläche für den Eingabemodus beim Remote-Debugging
- Im Bereich „Elemente“ werden jetzt URLs für #document-Knoten angezeigt.
- Effektive Content Security Policy im Anwendungsbereich
- Verbessertes Debugging für Animationen
- Dialogfeld „Ist diesem Code vertrauenswürdig?“ unter „Quellen und Selbst-XSS-Warnung“ in der Console
- Event-Listener-Haltepunkte in Web Workern und Worklets
- Das neue Medien-Badge für
<audio>
und<video>
- Vorabladen wurde in „Spekulatives Laden“ umbenannt
- Lighthouse 11.2.0
- Verbesserte Bedienungshilfen
- Sonstige Highlights
- Verbesserter @property-Bereich unter „Elements“ > „Stile“
- Bearbeitbare @property-Regel
- Probleme mit ungültigen @property-Regeln werden gemeldet
- Aktualisierte Liste der zu emulierenden Geräte
- Pretty Print-Inline-JSON in Script-Tags unter „Quellen“
- Private Felder in der Console automatisch vervollständigen
- Lighthouse 11.1.0
- Verbesserte Bedienungshilfen
- Einstellung von Web SQL
- Validierung des Seitenverhältnisses von Screenshots unter „Anwendung“ > „Manifest“
- Sonstige Highlights
- Neuer Bereich für benutzerdefinierte Eigenschaften unter „Elemente“ > „Stile“
- Mehr Verbesserungen für lokale Überschreibungen
- Erweiterte Suche
- Verbesserter Bereich „Quellen“
- Optimierter Arbeitsbereich im Bereich „Quellen“
- Bereiche in „Quellen“ neu anordnen
- Syntaxhervorhebung und optimierte Darstellung für weitere Skripttypen
- Medienfunktion „Bevorzugt-reduzierte-Transparenz“ emulieren
- Lighthouse 11
- Verbesserte Bedienungshilfen
- Verschiedene Highlights
- Verbesserungen im Netzwerkbereich
- Webinhalte noch schneller lokal überschreiben
- Inhalt von XHR und Abrufanfragen überschreiben
- Anfragen von Chrome-Erweiterungen ausblenden
- Lesbare HTTP-Statuscodes
Leistung: Änderungen der Abrufpriorität für Netzwerkereignisse ansehen
- Standardmäßig aktivierte Quelleneinstellungen: Code-Einklappen und automatische Dateienthüllung
- Verbesserte Fehlerbehebung bei Problemen mit Drittanbieter-Cookies
- Neue Farben
- Lighthouse 10.4.0
- Vorabladen im Bereich „Anwendung“ debuggen
- Die C/C++-WebAssembly-Debugging-Erweiterung für die Entwicklertools ist jetzt Open Source
- Sonstige Highlights
- (Experimentell) Neue Rendering-Emulation: „prefers-reduced-transparency“
- (Experimentell) Erweiterter Protokoll-Monitor
- Verbesserte Fehlerbehebung bei fehlenden Stylesheets
- Unterstützung für lineares Timing unter „Elements“ > „Stile“ > „Easing-Editor“
- Unterstützung von Speicher-Buckets und Metadatenansicht
- Lighthouse 10.3.0
- Bedienungshilfen: Tastaturbefehle und verbesserte Screenreader-Funktionen
- Verschiedene Highlights
- Verbesserungen bei Elementen
- Neues Preisvergleichsportal-Badge
- Auswahlspezifität in Kurzinfos
- Werte von benutzerdefinierten CSS-Eigenschaften in Kurzinfos
- Verbesserungen bei Quellen
- CSS-Syntaxhervorhebung
- Tastenkürzel zum Festlegen bedingter Haltepunkte
- Anwendung > Eindämmung von Bounce-Tracking
- Lighthouse 10.2.0
- Inhaltsscripts standardmäßig ignorieren
- Netzwerk > Verbesserte Reaktionen
- Sonstige Highlights
- Unterstützung für WebAssembly-Debugging
- Verbessertes Schrittverhalten in Wasm-Apps
- Fehlerbehebung bei Autofill mithilfe des Steuerfelds „Elemente“ und des Tabs „Probleme“
- Assertions in der Rekorder App
- Lighthouse 10.1.1
- Leistungsverbesserungen
- performance.mark() zeigt den Zeitpunkt an, wenn der Mauszeiger auf „Leistung“ > „Timings“ bewegt wird.
- Der Befehl „profile()“ füllt „Leistung“ > „Haupt“ aus
- Warnung bei langsamen Nutzerinteraktionen
- Web Vitals-Updates
- Einstellung von JavaScript Profiler: Phase 3
- Verschiedene Highlights
- Netzwerkantwortheader überschreiben
- Verbesserungen beim Debuggen von Nuxt, Vite und Rollup
- CSS-Verbesserungen unter „Elemente“ > „Stile“
- Ungültige CSS-Eigenschaften und -Werte
- Links zu Keyframes in der Kurzschreibweise für Animationen
- Neue Console-Einstellung: Autocomplete on Enter
- Im Befehlsmenü werden erstellte Dateien hervorgehoben
- Einstellung von JavaScript Profiler: Phase 2
- Sonstige Highlights
- Updates für Rekorder
- Rekorder-Replay-Erweiterungen
- Datensatz mit Pierce-Selektoren erstellen
- Mit Lighthouse-Analyse Aufnahmen als Puppeteer-Scripts exportieren
- Erweiterungen für Rekorder herunterladen
- Elemente > Updates für Stile
- CSS-Dokumentation im Bereich „Styles“
- Unterstützung für verschachtelte Preisvergleichsportale
- Logpoints und bedingte Haltepunkte in der Console markieren
- Irrelevante Skripts bei der Fehlerbehebung ignorieren
- Einstellung des JavaScript-Profilers
- Weniger Kontrast emulieren
- Lighthouse 10
- Verschiedene Highlights
- Fehlerbehebung bei HD-Farben mit dem Bereich „Stile“
- Verbesserte Haltepunkt-UX
- Anpassbare Tastenkombinationen für die Rekorder App
- Verbesserte Syntaxhervorhebung für Angular
- Caches im Anwendungsbereich neu organisieren
- Verschiedene Highlights
- Bereich „Leistung“ beim Aktualisieren löschen
- Updates für Rekorder
- Code Ihres User Flows in der Rekorder App ansehen und hervorheben
- Auswahltypen für Aufzeichnungen anpassen
- User Flow während der Aufzeichnung bearbeiten
- Automatischer Direktdruck
- Verbesserte Syntaxhervorhebung und Inline-Vorschau für Vue, SCSS und mehr
- Ergonomische und konsistente automatische Vervollständigung in der Console
- Verschiedene Highlights
- Aufzeichnung: Optionen zum Kopieren von Schritten, Wiedergabe auf der Seite, Kontextmenü des Schritts
- Tatsächliche Funktionsnamen in Aufzeichnungen der Aufführung anzeigen
- Neue Tastenkürzel im Bereich „Konsole und Quellen“
- Verbesserte JavaScript-Fehlerbehebung
- Verschiedene Highlights
- [Experimentell] Verbesserte UX beim Verwalten von Haltepunkten
- [Experimentell] Automatische In-Place-Optimierung
- Tipps zu inaktiven CSS-Properties
- XPath und Textauswahlen im Rekorder-Bereich automatisch erkennen
- Durch Kommas getrennte Ausdrücke ausführen
- Verbesserte Einstellung für die Ignorierliste
- Sonstige Highlights
- Tastenkürzel in den DevTools anpassen
- Zwischen hellem und dunklem Design mit Tastenkombination wechseln
- C/C++ Objekte im Memory Inspector hervorheben
- Vollständige Initiatorinformationen für den HAR-Import unterstützen
- DOM-Suche nach Drücken der Taste
Enter
starten start
- undend
-Symbole füralign-content
-CSS-Flexbox-Eigenschaften anzeigen- Sonstige Highlights
- Dateien im Bereich „Quellen“ nach „Erstellt“/„Bereitgestellt“ gruppieren
- Verknüpfte Stack-Traces für asynchrone Vorgänge
- Bekannte Drittanbieter-Scripts automatisch ignorieren
- Verbesserter Aufrufstack während der Fehlerbehebung
- Quellen auf der Ignorieren-Liste im Bereich „Quellen“ ausblenden
- Dateien, die auf der Ignorierliste aufgeführt sind, im Befehlsmenü ausblenden
- Neuer Messwert „Interaktionen“ im Bereich „Leistung“
- Aufschlüsselung der LCP-Zeiten im Bereich „Leistungsstatistiken“
- Standardnamen für Aufnahmen im Rekorderbereich automatisch generieren
- Sonstige Highlights
- Schritt-für-Schritt-Anleitung zum Abspielen im Rekorder
- Unterstützung von Mouseover-Ereignissen im Rekorder-Bereich
- Largest Contentful Paint (LCP) im Bereich „Leistungsstatistiken“
- Flirten im Text (FOIT, FOUT) als mögliche Ursachen für Layout Shifts identifizieren
- Protokoll-Handler im Manifestbereich
- Symbol für die oberste Ebene im Elementbereich
- Wasm-Debugging-Informationen zur Laufzeit anhängen
- Unterstützung für Live-Bearbeitung während der Fehlerbehebung
- @Scope at-Regeln im Bereich „Styles“ ansehen und bearbeiten
- Verbesserungen an der Quellkarte
- Sonstige Highlights
- Frame während der Fehlerbehebung neu starten
- Optionen für die Zeitlupenwiedergabe im Steuerfeld für den Rekorder
- Erweiterung für das Rekorder-Steuerfeld erstellen
- Dateien im Bereich „Quellen“ nach „Erstellt“/„Bereitgestellt“ gruppieren
- Neuer Bericht „Nutzertimings“ im Bereich „Leistungsstatistiken“
- Zugewiesene Anzeigenfläche eines Elements anzeigen
- Nebenläufigkeit der Hardware für Performance-Aufzeichnungen simulieren
- Vorschau für nicht farbliche Werte beim automatischen Vervollständigen von CSS-Variablen anzeigen
- Blockierende Frames im Bereich „Back-Forward-Cache“ identifizieren
- Verbesserte Vorschläge für die automatische Vervollständigung von JavaScript-Objekten
- Verbesserungen an Quellkarten
- Verschiedene Highlights
- Doppelklick- und Rechtsklickereignisse im Bereich „Rekorder“ erfassen
- Neuer Zeitraum und Snapshot-Modus im Lighthouse-Steuerfeld
- Verbesserte Zoomsteuerung im Bereich „Leistungsstatistiken“
- Löschen einer Leistungsaufzeichnung bestätigen
- Bereiche im Elementbereich neu anordnen
- Farbe außerhalb des Browsers auswählen
- Verbesserte Vorschau von Inline-Werten beim Debuggen
- Unterstützung großer Blobs für virtuelle Authenticatoren
- Neue Tastenkombinationen im Bereich „Quellen“
- Verbesserungen bei Quellkarten
- Vorschaufunktion: Neuer Bereich „Leistungsstatistiken“
- Neue Tastenkürzel zum Emulieren von hellen und dunklen Designs
- Verbesserte Sicherheit auf dem Tab „Netzwerkvorschau“
- Verbessertes Neuladen am Haltepunkt
- Änderungen an der Console
- Nutzerfluss-Aufzeichnung zu Beginn abbrechen
- Übernommene Pseudoelemente zum Hervorheben im Bereich „Stile“ anzeigen
- Verschiedene Highlights
- [Experimentell] CSS-Änderungen kopieren
- [Experimentell] Farbe außerhalb des Browsers auswählen
- Erfasste Nutzerflüsse als JSON-Datei importieren und exportieren
- Kaskadenebenen im Bereich „Stile“ ansehen
- Unterstützung der Farbfunktion
hwb()
- Verbesserte Darstellung von Privatgrundstücken
- Verschiedene Highlights
- [Experimentell] Neuer Zeitraum und Snapshot-Modus im Lighthouse-Steuerfeld
- @supports bei Regeln im Bereich „Stile“ ansehen und bearbeiten
- Standardmäßig gängige Selektoren unterstützen
- Auswahl für die Aufnahme anpassen
- Aufzeichnungen umbenennen
- Vorschau von Klassen-/Funktionseigenschaften beim Bewegen des Mauszeigers
- Teilweise präsentierte Frames im Bereich „Leistung“
- Sonstige Highlights
- WebSocket-Anfragen drosseln
- Neuer Bereich „Reporting API“ im Anwendungsbereich
- Support wartet, bis das Element im Steuerfeld des Rekorders sichtbar und anklickbar ist
- Verbessertes Console-Styling, bessere Formatierung und Filterung
- Chrome-Erweiterung mit Quellkartendateien debuggen
- Verbesserte Struktur des Quellordners im Bereich „Quellen“
- Quelldateien von Workern im Bereich „Quellen“ anzeigen
- Änderungen am automatischen dunklen Design in Chrome
- Touchfreundliche Farbauswahl und geteilter Bereich
- Sonstige Highlights
- Vorschaufunktion: Ganzseitige Baumstruktur für Barrierefreiheit
- Genauere Änderungen auf dem Tab „Änderungen“
- Längere Zeitüberschreitung für die Aufzeichnung des User Flows festlegen
- Seiten müssen über den Tab „Back-Forward-Cache“ im Cache gespeichert werden
- Neuer Filter im Bereich „Eigenschaften“
- CSS-Medienfunktion „forced-colors“ emulieren
- Befehl „Lineale anzeigen, wenn der Mauszeiger darauf bewegt wird“
- Unterstützung von
row-reverse
undcolumn-reverse
im Flexbox-Editor - Neue Tastenkürzel zum Wiedergeben von XHR-Anfragen und zum Maximieren aller Suchergebnisse
- Lighthouse 9 im Lighthouse-Steuerfeld
- Verbesserter Bereich „Quellen“
- Verschiedene Highlights
- [Experimentell] Endpunkte im Bereich „Reporting API“
- Vorabversion: Neues Steuerfeld für den Rekorder
- Geräteliste im Gerätemodus aktualisieren
- Automatische Vervollständigung mit „Als HTML bearbeiten“
- Verbessertes Code-Debugging
- Entwicklertools-Einstellungen geräteübergreifend synchronisieren
- Vorabversion: Neuer Bereich „CSS-Übersicht“
- Verbessertes Bearbeiten und Kopieren von CSS-Längen
- CSS-Medienfunktion „prefers-contrast“ emulieren
- Die Funktion „Dunkles Design automatisch“ von Chrome emulieren
- Deklarationen im Bereich „Stile“ als JavaScript kopieren
- Neuer Tab „Nutzlast“ im Bereich „Netzwerk“
- Die Anzeige von Properties im Bereich „Properties“ wurde verbessert.
- Option zum Ausblenden von CORS-Fehlern in der Console
- Korrekte Vorschau und Auswertung von
Intl
-Objekten in der Console - Einheitliche asynchrone Stacktraces
- Konsolen-Seitenleiste beibehalten
- Bereich „Verworfener Anwendungs-Cache“ im Bereich „Anwendung“
- [Experimentell] Neuer Bereich „Reporting API“ im Bereich „Anwendung“
- Neue Authoring-Tools für die CSS-Länge
- Probleme auf dem Tab „Probleme“ ausblenden
- Die Darstellung von Unterkünften wurde verbessert
- Lighthouse 8.4 im Leuchtturm-Steuerfeld
- Snippets im Bereich „Quellen“ sortieren
- Neue Links zu den Übersetzungen der Versionshinweise und Melden eines Übersetzungsfehlers
- Verbesserte Benutzeroberfläche für das Befehlsmenü der Entwicklertools
- Entwicklertools in deiner bevorzugten Sprache verwenden
- Neue Nest Hub-Geräte in der Geräteliste
- Ursprungstests in der Detailansicht des Frames
- Logo für neue Preisvergleichsportal-Containerabfragen
- Neues Kästchen zum Umkehren der Netzwerkfilter
- Geplante Einstellung der Console-Seitenleiste
- Auf dem Tab „Probleme“ und im Bereich „Netzwerk“ können Sie unformatierte
Set-Cookies
-Header anzeigen - Konsistente Anzeige nativer Zugriffsfunktionen als eigene Properties in der Console
- Richtige Fehler-Stack-Traces für Inline-Scripts mit #sourceURL
- Farbformat im Bereich „Berechnet“ ändern
- Benutzerdefinierte Kurzinfos durch native HTML-Kurzinfos ersetzen
- [Experimentell] Probleme auf dem Tab „Probleme“ ausblenden
- Bearbeitbare CSS-Containerabfragen im Bereich „Stile“
- Web-Bundle-Vorschau im Bereich „Netzwerk“
- Fehlerbehebung bei der Attribution Reporting API
- Bessere Stringverarbeitung in der Console
- Verbesserte CORS-Fehlerbehebung
- Lighthouse 8.1
- URL für neue Notiz im Manifest-Bereich
- Feste CSS-Abgleich-Selektoren
- JSON-Antworten im Bereich „Netzwerk“ im benutzerfreundlichen Format anzeigen
- CSS-Raster-Editor
- Unterstützung für die erneute Deklaration von
const
in der Console - Quellauftrags-Viewer
- Neue Tastenkombination zum Aufrufen von Frame-Details
- Erweiterte Unterstützung für CORS-Debugging
- XHR-Label in „Fetch/XHR“ umbenennen
- Wasm-Ressourcentyp im Bereich „Netzwerk“ filtern
- User-Agent-Clienthinweise für Geräte im Tab „Netzwerkbedingungen“
- Probleme im Quirks-Modus auf dem Tab „Probleme“ melden
- Compute-Überschneidungen in den Bereich „Leistung“ aufnehmen
- Lighthouse 7.5 im Leuchtturm-Steuerfeld
- Das Kontextmenü „Frame neu starten“ im Aufrufstapel wurde eingestellt
- [Experimentell] Protokollmonitor
- [Experimentell] Puppeteer-Rekorder
- Pop-up mit Web Vitals-Informationen
- Neuer Memory Inspector
- CSS-Scroll-Snap visualisieren
- Neuer Bereich „Logoeinstellungen“
- Verbesserte Bildvorschau mit Informationen zum Seitenverhältnis
- Neue Schaltfläche für Netzwerkbedingungen mit Optionen zum Konfigurieren von
Content-Encoding
s - Verknüpfung zum Aufrufen des berechneten Werts
accent-color
Keyword- Problemtypen mit Farben und Symbolen kategorisieren
- Trust-Tokens löschen
- Blockierte Funktionen in der Detailansicht des Frames
- Tests in den Testeinstellungen filtern
- Neue Spalte
Vary Header
im Bereich „Cache-Speicher“ - Unterstützung der JavaScript-Prüfung für private Marken
- Erweiterte Unterstützung für das Debugging von Haltepunkten
- Vorschau beim Bewegen des Mauszeigers mit der Notation
[]
unterstützen - Verbesserte Gliederung von HTML-Dateien
- Korrekte Fehler-Stacktraces für das Wasm-Debugging
- Neue CSS-Flexbox-Debugging-Tools
- Neues Core Web Vitals-Overlay
- Anzahl der Probleme in die Console-Statusleiste verschoben
- Probleme mit vertrauenswürdigen Webaktivitäten melden
- Strings in der Console als (gültige) JavaScript-Stringliterale formatieren
- Neuer Bereich „Trust Tokens“ im Anwendungsbereich
- CSS-Medienfunktion „color-gamut“ emulieren
- Verbesserte Tools für progressive Web-Apps
- Neue Spalte
Remote Address Space
im Bereich „Netzwerk“ - Leistungsverbesserungen
- Zulässige und nicht zulässige Funktionen in der Detailansicht des Frames anzeigen
- Neue Spalte
SameParty
im Bereich „Cookies“ - Eingestellter nicht standardmäßiger
fn.displayName
-Support - Einstellung von
Don't show Chrome Data Saver warning
im Menü „Einstellungen“ - [Experimentell] Automatische Berichte zu Problemen mit niedrigem Kontrast auf dem Tab „Probleme“
- [Experimentell] Baumansicht mit vollständiger Barrierefreiheit im Bereich „Elemente“
- Unterstützung bei der Fehlerbehebung bei Verstößen gegen vertrauenswürdige Typen
- Knoten einen Screenshot außerhalb des Darstellungsbereichs aufnehmen
- Neuer Tab „Trust Tokens“ für Netzwerkanfragen
- Lighthouse 7 im Lighthouse-Steuerfeld
- Unterstützung für erzwungenen CSS-Status
:target
- Neue Verknüpfung zum Duplizieren eines Elements
- Farbfelder für benutzerdefinierte CSS-Properties
- Neue Tastenkürzel zum Kopieren von CSS-Eigenschaften
- Neue Option zum Anzeigen von URL-decodierten Cookies
- Nur sichtbare Cookies löschen
- Neue Option zum Löschen von Drittanbieter-Cookies im Bereich „Speicher“
- User-Agent-Client-Hints für benutzerdefinierte Geräte bearbeiten
- Einstellung „Netzwerkprotokoll aufzeichnen“ beibehalten
- WebTransport-Verbindungen im Bereich „Netzwerk“ ansehen
- „Online“ umbenannt in „Keine Drosselung“
- Neue Kopieroptionen in der Konsole, im Bereich „Quellen“ und im Bereich „Stile“
- Informationen zu neuen Service Workern in der Frame-Detailansicht
- Arbeitsspeicherinformationen in der Frame-Detailansicht messen
- Feedback über den Tab „Probleme“ geben
- Im Bereich „Leistung“ abgelegte Frames
- Faltbare Geräte und Dual-Screen-Geräte im Gerätemodus emulieren
- [Experimentell] Browsertests mit dem Puppeteer-Rekorder automatisieren
- [Experimentell] Schrifteditor im Bereich „Stile“
- [Experimentell] Debugging-Tools in der CSS-Flexbox
- [Experimentell] Neuer Tab „CSP-Verstöße“
- [Experimentell] Neue Berechnung des Farbkontrasts – Advanced Perceptual Contrast Algorithm (APCA)
- Schnelleres Starten der Entwicklertools
- Neue Tools zur Visualisierung von Blickwinkeln auf Preisvergleichsportalen
- Nicht unterstützte Bildtypen emulieren
- Speicherkontingentgröße im Bereich „Speicher“ simulieren
- Neue Web Vitals-Spur im Bereich „Leistung“
- CORS-Fehler im Bereich „Netzwerk“ melden
- Informationen zur ursprungsübergreifenden Isolierung in der Frame-Detailansicht
- Informationen zu neuen Web Workern in der Frame-Detailansicht
- Details zum Öffnerrahmen für geöffnete Fenster anzeigen
- Bereich „Netzwerk“ im Bereich „Service Workers“ öffnen
- Property-Wert kopieren
- Stacktrace für Netzwerkinitiator kopieren
- Wasm-Variablenwert bei Mausbewegung als Vorschau anzeigen
- Wasm-Variable in der Console auswerten
- Einheitliche Maßeinheiten für Datei-/Speichergrößen
- Pseudoelemente im Elementbereich hervorheben
- [Experimentell] CSS-Flexbox-Debugging-Tools
- [Experimentell] Tastenkombinationen für Akkorde anpassen
- Neue Debugging-Tools für CSS Grid
- Neuer Tab „WebAuthn“
- Tools zwischen dem oberen und unteren Steuerfeld verschieben
- Neue Seitenleiste „Berechnet“ im Bereich „Stile“
- CSS-Eigenschaften im Bereich „Berechnet“ gruppieren
- Lighthouse 6.3 im Lighthouse-Steuerfeld
performance.mark()
-Ereignisse im Bereich „Timings“- Neue
resource-type
- undurl
-Filter im Bereich „Netzwerk“ - Änderungen an der Ansicht der Frame-Details
Settings
im Menü „Weitere Tools“ wird eingestellt- [Experimentell] Probleme mit dem Farbkontrast im Bereich „CSS-Übersicht“ ansehen und beheben
- [Experimentell] Tastenkombinationen in den Entwicklertools anpassen
- Bereich „Neue Medien“
- Knoten-Screenshots über das Kontextmenü des Steuerfelds „Elemente“ aufnehmen
- Änderungen am Tab „Probleme“
- Fehlende lokale Schriftarten emulieren
- Inaktive Nutzer emulieren
prefers-reduced-data
emulieren- Unterstützung neuer JavaScript-Funktionen
- Lighthouse 6.2 im Lighthouse-Steuerfeld
- Eintrag „andere Ursprünge“ im Bereich „Service Worker“ wird eingestellt
- Abdeckungsübersicht für gefilterte Elemente anzeigen
- Neue Ansicht für Frame-Details im Bereich „Anwendung“
- Barrierefreie Farbvorschläge im Bereich „Stile“
- Bereich Eigenschaften im Bereich „Elemente“ wieder aktivieren
- Lesbare
X-Client-Data
-Headerwerte im Bereich „Netzwerk“ - Benutzerdefinierte Schriftarten im Bereich „Stile“ automatisch vervollständigen
- Ressourcentyp immer im Bereich „Netzwerk“ anzeigen
- Schaltflächen in den Bereichen „Elemente“ und „Netzwerk“ löschen
- Stilbearbeitung für CSS-in-JS-Frameworks
- Lighthouse 6 im Lighthouse-Bereich
- Einstellung von First Meaningful Paint (FMP)
- Unterstützung neuer JavaScript-Funktionen
- Neue Warnungen zu App-Verknüpfungen im Manifest-Bereich
- Service Worker-Ereignisse vom Typ
respondWith
auf dem Tab „Timing“ - Konsistentes Anzeigen des Bereichs „Berechnet“
- Bytecode-Offsets für WebAssembly-Dateien
- Zeilenweises Kopieren und Ausschneiden im Bereich „Quellen“
- Änderungen an den Console-Einstellungen
- Änderungen am Bereich „Leistung“
- Neue Symbole für Haltepunkte, bedingte Haltepunkte und Logpunkte
- Websiteprobleme mit dem neuen Tab „Probleme“ beheben
- Informationen zur Barrierefreiheit in der Kurzinfo zum Inspektionsmodus aufrufen
- Änderungen am Bereich „Leistung“
- Genauere Promise-Terminologie in der Console
- Aktualisierungen des Stilbereichs
- Einstellung des Bereichs Eigenschaften im Bereich „Elemente“
- Unterstützung von App-Verknüpfungen im Manifest-Bereich
- Sehschwächen emulieren
- Sprachen emulieren
- Debugging der Cross-Origin-Embedder-Richtlinie (COEP)
- Neue Symbole für Haltepunkte, bedingte Haltepunkte und Logpoints
- Netzwerkanfragen ansehen, die ein bestimmtes Cookie setzen
- Über das Befehlsmenü links andocken
- Die Option „Einstellungen“ wurde im Hauptmenü verschoben
- Der Bereich „Audits“ heißt jetzt Lighthouse
- Alle lokalen Überschreibungen in einem Ordner löschen
- Aktualisierte Benutzeroberfläche für lange Aufgaben
- Unterstützung maskierbarer Symbole im Manifestbereich
- Unterstützung von Moto G4 im Gerätemodus
- Aktualisierungen in Bezug auf Cookies
- Genauere Symbole für Web-App-Manifeste
- Bewegen Sie den Mauszeiger auf die CSS-Eigenschaften
content
, um nicht maskierte Werte zu sehen. - Source Map-Fehler in der Console
- Einstellung zum Deaktivieren des Scrollens über das Ende einer Datei hinaus
- Unterstützung für
let
- undclass
-Erneute Deklarationen in der Console - Verbessertes WebAssembly-Debugging
- Initiatorenketten auf dem Tab „Initiator“ anfordern
- Ausgewählte Netzwerkanfrage in der Übersicht hervorheben
- Spalten für URL und Pfad im Steuerfeld „Netzwerk“
- Aktualisierte User-Agent-Strings
- Neue Konfigurations-UI für den Bereich „Audits“
- Codeabdeckungsmodi pro Funktion oder pro Block
- Die Codeabdeckung muss jetzt durch ein Seitenaktualisieren gestartet werden.
- Fehler bei der Blockierung von Cookies beheben
- Cookie-Werte ansehen
- Unterschiedliche Einstellungen für „prefers-color-scheme“ und „prefers-reduced-motion“ simulieren
- Aktualisierungen der Codeabdeckung
- Fehlerbehebung, wenn eine Netzwerkressource angefordert wurde
- In den Bereichen „Console“ und „Quellen“ werden die Einstellungen für Einzüge wieder berücksichtigt
- Neue Tastenkombinationen für die Cursornavigation
- Unterstützung mehrerer Kunden im Bereich „Audits“
- Fehlerbehebung für Zahlungsabwickler
- Lighthouse 5.2 im Bereich „Audits“
- Largest Contentful Paint im Bereich „Leistung“
- Probleme mit DevTools-Dateien über das Hauptmenü
- Elementstile kopieren
- Layout Shifts visualisieren
- Lighthouse 5.1 im Bereich „Audits“
- Synchronisierung des Betriebssystem-Designs
- Tastenkombination zum Öffnen des Breakpoints-Editors
- Prefetch-Cache im Bereich „Netzwerk“
- Private Properties beim Ansehen von Objekten
- Benachrichtigungen und Push-Nachrichten im Anwendungsbereich
- Automatische Vervollständigung mit CSS-Werten
- Neue Benutzeroberfläche für Netzwerkeinstellungen
- WebSocket-Nachrichten in HAR-Exporten
- Schaltflächen für den HAR-Import und -Export
- Arbeitsspeichernutzung in Echtzeit
- Portnummern für die Registrierung von Dienst-Workern
- Ereignisse für den Hintergrundabruf und die Hintergrundsynchronisierung prüfen
- Puppeteer für Firefox
- Sinnvolle Voreinstellungen beim automatischen Vervollständigen von CSS-Funktionen
- Websitedaten über das Befehlsmenü löschen
- Alle IndexedDB-Datenbanken ansehen
- Nicht komprimierte Größe einer Ressource beim Bewegen des Mauszeigers anzeigen
- Inline-Haltepunkte im Bereich „Haltepunkte“
- Anzahl der IndexedDB- und Cache-Ressourcen
- Einstellung zum Deaktivieren der detaillierten Kurzinfo „Inspizieren“
- Einstellung zum Ein- und Ausblenden von Tabulatorabständen im Editor
- Alle Knoten hervorheben, die von der CSS-Eigenschaft betroffen sind
- Lighthouse v4 im Bereich „Audits“
- WebSocket-Binärnachrichtenanzeige
- Screenshot vom Bereich im Befehlsmenü erstellen
- Service Worker-Filter im Bereich „Network“
- Aktualisierungen des Leistungssteuerfelds
- Lange Aufgaben in Aufzeichnungen im Bereich „Leistung“
- First Paint im Bereich „Timing“
- Bonustipp: Tastenkombination zum Aufrufen von RGB- und HSL-Farbcodes (Video)
- Logpoints
- Detaillierte Kurzinfos im Prüfmodus
- Codeabdeckungsdaten exportieren
- Console mit einer Tastatur bedienen
- Linie für AAA-Kontrastverhältnis in der Farbauswahl
- Benutzerdefinierte Überschreibungen für die Standortermittlung speichern
- Code Folding
- Tab „Frames“ wurde in Tab „Nachrichten“ umbenannt
- Bonustipp: Im Steuerfeld "Netzwerk" nach Property filtern (Video)
- Im Bereich „Leistung“ Leistungsmesswerte visualisieren
- Textknoten in der DOM-Struktur hervorheben
- JS-Pfad in einen DOM-Knoten kopieren
- Aktualisierungen des Bereichs „Audits“, einschließlich einer neuen Prüfung, mit der JS-Bibliotheken erkannt werden, und neuer Keywords für den Zugriff auf den Bereich „Audits“ über das Menü „Befehle“
- Bonustipp: Mediaabfragen mit dem Gerätemodus prüfen (Video)
- Bewegen Sie den Mauszeiger auf ein Ergebnis eines Live-Expressions, um einen DOM-Knoten hervorzuheben.
- DOM-Knoten als globale Variablen speichern
- Informationen zum Initiator und zur Priorität sind jetzt in HAR-Importen und ‑Exporten enthalten
- Über das Hauptmenü auf das Befehlsmenü zugreifen
- Bild-im-Bild-Pausen
- Bonustipp: Mit
monitorEvents()
die ausgelösten Ereignisse eines Knotens in der Console protokollieren (Video) - Live-Ausdrücke in der Console
- DOM-Knoten während der Eager Evaluation hervorheben
- Optimierungen für den Bereich „Leistung“
- Zuverlässigere Fehlerbehebung
- Netzwerkdrosselung über das Befehlsmenü aktivieren
- Bedingte Unterbrechungen automatisch vervollständigen
- Bei AudioContext-Ereignissen pausieren
- Fehler in Node.js-Anwendungen mit ndb beheben
- Bonustipp: Nutzerinteraktionen in der Praxis mit der User Timing API messen
- Eager Evaluation
- Argumenthinweise
- Automatische Vervollständigung von Funktionen
- ES2017 keywords
- Lighthouse 3.0 im Bereich „Audits“
- BigInt-Unterstützung
- Property-Pfade zum Bereich „Watch“ hinzufügen
- Die Option „Zeitstempel anzeigen“ wurde in die Einstellungen verschoben
- Bonustipp: Weniger bekannte Konsolenmethoden (Video)
- In allen Netzwerkheadern suchen
- Vorschau der Werte von CSS-Variablen
- Als Abruf kopieren
- Neue Prüfungen, Konfigurationsoptionen für Computer und Aufrufspuren
- Endlosschleifen beenden
- Nutzertiming auf den Tabs „Leistung“
- JavaScript-VM-Instanzen werden im Bereich „Speicher“ klar aufgeführt
- Tab „Network“ wurde in Tab „Page“ (Seite) umbenannt
- Änderungen am dunklen Design
- Informationen zur Zertifikatstransparenz im Bereich „Sicherheit“
- Funktionen zur Website-Isolierung im Bereich „Leistung“
- Bonustipp: Ebenenbereich + Animations-Inspector (Video)
- Blackboxing im Bereich „Netzwerk“
- Zoom im Gerätemodus automatisch anpassen
- Perfekter Druck auf den Tabs „Vorschau“ und „Antwort“
- HTML-Inhalte in der Vorschau ansehen
- Unterstützung lokaler Überschreibungen für Stile in HTML
- Bonustipp: Blackbox-Framework-Scripts, um Event-Listener-Haltepunkte nützlicher zu machen
- Lokale Überschreibungen
- Neue Bedienungshilfen
- Tab „Änderungen“
- Neue SEO- und Leistungsaudits
- Mehrere Aufzeichnungen im Steuerfeld „Leistung“
- Zuverlässiges Code-Stepping mit Workern in asynchronem Code
- Zusatztipp: Automatisieren Sie Entwicklertools-Aktionen mit Puppeteer (Video)
- Leistungsüberwachung
- Seitenleiste der Console
- Ähnliche Konsolenmelden gruppieren
- Bonustipp: Pseudoklasse für Hover ein-/ausschalten (Video)
- Unterstützung für die Remote-Fehlerbehebung für mehrere Kunden
- Arbeitsbereiche 2.0
- 4 neue Prüfungen
- Push-Benachrichtigungen mit benutzerdefinierten Daten simulieren
- Hintergrundsynchronisierungsereignisse mit benutzerdefinierten Tags auslösen
- Bonustipp: Event-Listener-Haltepunkte (Video)
- Top-Level-await in der Console
- Neue Workflows für Screenshots
- Hervorhebung des CSS-Rasters
- Eine neue Console API zum Abfragen von Objekten
- Neue Console-Filter
- HAR-Importe im Bereich „Netzwerk“
- Cache-Ressourcen mit Vorschau
- Bessere Cache-Fehlerbehebung
- Codeabdeckung auf Blockebene
- Simulation der Drosselung von Mobilgeräten
- Speichernutzung ansehen
- Sehen, wann ein Service Worker Antworten im Cache gespeichert hat
- FPS-Messer über das Befehlsmenü aktivieren
- Mausradverhalten zum Zoomen oder Scrollen festlegen
- Unterstützung der Fehlerbehebung für ES6-Module
- Neuer Audit-Bereich
- Drittanbieterlogos
- Eine neue Touch-Geste für „Weiter bis hier“
- Asynchrones JavaScript kennenlernen
- Aussagekräftigere Objektvorschauen in der Console
- Aussagekräftigere Kontextauswahl in der Console
- Echtzeitaktualisierungen auf dem Tab „Abdeckung“
- Einfachere Optionen für die Netzwerkdrosselung
- Asynchrone Stacks standardmäßig aktiviert
- Abdeckung von CSS- und JS-Code
- Ganzseitige Screenshots
- Anfragen blockieren
- Über „async await“ springen
- Einheitliches Befehlsmenü