Any way to throttle calls to a specific API in Chrome DevTools while leaving others unthrottled?

I have a single page application that communicates with a few different APIs, and I am hoping to throttle requests made to a specific one for testing. Is it possible to be domain specific with network throttling using Chrome DevTools?

I know you can throttle the network in Chrome and simulate a slow connection (e.g. Regular 3G connection) via the Network conditions tab, but this affects all requests. I am hoping to just affect one specific API to simulate the situation where this other service is really slow but all others are fine.

If you can change the URLs, there's a site http://www.deelay.me/ that is a delay proxy for HTTP resources. For example, if you want URL http://example.com/example to be delayed by 5 seconds, change it to http://www.deelay.me/5000/http://example.com/example.

No, Chrome DevTools network throttling does not allow you to do selective throttling.

If you want to simulate specific services being slow and you have them running on your local machine, I would recommend installing a throttling proxy (e.g. Charles proxy).

If those services are deployed and you still want to simulate sluggish response, I would try amending /etc/hosts to point to a local charles proxy as well.

Someone has now built a chrome extension for this - URL Throttler.

Chrome developer tools doesn't allow selective throttling of network requests. I found this reddit post - https://www.reddit.com/r/chrome/comments/ogun3w/limitations_of_chrome_devtools_throttle_network/ which covers 3 approaches to delay network requests.

1. Throttle Network Traffic using Browser DevTools Network Throttle feature
2. Publicly available APIs which respond with delay and using a browser extension to redirect your actual request to those Public APIs
3. Chrome extension which adds actual delays to the network requests

All these three approaches are well explained in this article - https://requestly.io/blog/2021/07/02/adding-delay-to-network-requests/

In order to do domain specific request throttling, you can use approach 3. You can configure Requestly Delay Network Request Rule to add delays.

You can follow these steps

1. Get Requestly from https://requestly.io
2. Open https://app.requestly.io/rules
3. Create a Rule and Select Delay Request rule type
4. Configure Delay Request Rule like this

Precaution - You should be specific when applying delay request because it makes your browsing experience very slow. You should add a filter if you want of request type when adding a delay on multiple requests

Adding filters on Request types

Just click on the filter icon in the delay request rule and then you can select the request types like - JS CSS or XHR

Used this multiple times. This works.

References

• https://www.reddit.com/r/chrome/comments/ogun3w/limitations_of_chrome_devtools_throttle_network/
• https://requestly.io/blog/2021/07/02/adding-delay-to-network-requests/

Disclaimer: I built Requestly (& still building with lots of heart)

This network-spinner-devtool is a browser devtools extension, with capacity of URL level configuration and control, to allow introducing delay before sending http request or after receiving response(support in firefox only).

it supports both Chrome and Firefox browser

Can install from Chrome web store as well Chrome DevTools