DevTools (Chrome)
Powerful built-in developer tools revolutionizing web development with DOM manipulation, network analysis, and performance profiling
Shortcuts that support web application optimization through performance analysis and network monitoring
Ctrl+E
Start/Stop recording
Starts or stops recording network activity.
💡 Hint: Ctrl+E = Enable/Disable
🎯 Start and stop performance recording to analyze application behavior
Ctrl+R
Record reload
Reloads the page and records network activity.
💡 Hint: Reload
🎯 Record page reload to measure initial load performance
Ctrl+F5
Hard reload
Reloads the page ignoring cached content.
💡 Hint: Ctrl+F5 = Force refresh
🎯 Reload ignoring cache to verify performance with latest resources
Ctrl+Shift+M
Toggle Device Mode
Toggles the device emulation mode.
💡 Hint: Mobile device
🎯 Simulate performance on various devices with device mode
Ctrl+Shift+F
Search across all sources
Searches for text across all loaded resources.
💡 Hint: Find in all files
🎯 Search all resource files to identify performance bottlenecks
R
Replay XHR
Replays the selected XHR request.
💡 Hint: Replay
🎯 Replay XHR requests to analyze network responses in detail