11+ Advanced Chrome Debugging Techniques to Boost Development Efficiency 🚀

aifou
5 min readMar 15, 2024

1.One-click to reinitiate a request

When coordinating with backend interfaces or investigating online bugs, you might often hear them say: Try sending the request again, I’ll check why there was an error!

Resending a request, there’s a simple way to do it.
1. Select Network
2. Click Fetch/XHR
3. Choose the request to resend
4. Right-click and select Replay XHR

No need to refresh the page, no need to go through page interactions, isn’t that very cool!!!

2. Quickly initiate a request in the console
Still in the scenario of debugging or fixing bugs, for the same request, sometimes you need to modify the parameters and reinitiate it, is there a shortcut?
1. Select Network
2. Click Fetch/XHR
3. Choose Copy as fetch
4. Paste the code in the console
5. Modify the parameters, press Enter to complete

--

--