Chrome DevTools können viel mehr als Inspect Element. 20 Funktionen, die die meisten nicht kennen.
Konsolen-Tricks¶
- $0 — ausgewähltes Element
- $_ — letztes Ergebnis
- copy(obj) — kopiert in die Zwischenablage
- console.table(data)
- monitor(fn) — protokolliert Funktionsaufrufe
Netzwerk¶
- Copy as fetch/curl
- Throttling (Slow 3G)
- Anfragen blockieren
- Log beibehalten
Elements & CSS¶
- Zustand erzwingen (:hover, :focus)
- CSS Overview
- Computed Tab
Performance & Speicher¶
- Coverage — ungenutztes CSS/JS
- Lighthouse
- Memory Snapshot
- Performance Recording
- Paint Flashing
Befehlsmenü¶
Ctrl+Shift+P in DevTools — wie die VS Code Command Palette.
Tipp¶
Verfolgen Sie What’s New in DevTools auf developer.chrome.com.
chromedebuggingfrontend