Chrome DevTools umí mnohem víc než inspect element. 20 funkcí, o kterých většina neví.
Console triky¶
- $0 — vybraný element
- $_ — poslední výsledek
- copy(obj) — zkopíruje do clipboardu
- console.table(data)
- monitor(fn) — loguje volání funkce
Network¶
- Copy as fetch/curl
- Throttling (Slow 3G)
- Block requests
- Preserve log
Elements & CSS¶
- Force state (:hover, :focus)
- CSS Overview
- Computed tab
Performance & Memory¶
- Coverage — nepoužívaný CSS/JS
- Lighthouse
- Memory snapshot
- Performance recording
- Paint flashing
Command Menu¶
Ctrl+Shift+P v DevTools — jako VS Code Command Palette.
Tip¶
Sledujte What’s New in DevTools na developer.chrome.com.
chromedebuggingfrontend