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

Question

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.

Solution 1

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.

Solution 2

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.

Solution 3

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

Solution 4

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)

View more solutions

Comments

[David Crozier]

Thanks for the reply - I ended up just changing my etc/hosts file like you said to simulate the issued and it worked well enough

[mhenry1384]

This works in combination with the "Requestly" Chrome extension - chrome.google.com/webstore/detail/requestly-redirect-url-mo/‌​…

[DanV]

@mhenry1384 that doesn't extension doesn't mention anything about throttling

[mhenry1384]

@DanV I meant that you can use requestly to redirect your call to deelay.me

[akcasoy]

maybe it is worth mentioning that the deelay.me works just with public endpoints..

[akcasoy]

i have just tried to use deelay with a local npm installation (running at localhost). and create a redirect to local deelay server with this extension. so i thought the internal/private endpoints can also be called.. i see in chrome developer tools that my original GET call is redirected with a status code 307 (Internal Redirect). And i just see an additional OPTION request to my localhost, but i dont see a second GET request to my localhost.. could you somehow see the problem :/

[engray]

Hi, I'm trying to throttle 1 specific URL, for example https://my-service.net/api/bestapi Would you be able to share your /etc/hosts config to be able to throttle 1 API? I'm not sure how to do it, I was able to throttle https://my-service.net but not luck with specific endpoint.

[Sachin Jain]

@akcasoy You can use another Public API Endpoint mentioned in this article - requestly.io/blog/2021/07/02/adding-delay-to-network-request‌​s It works for private/local end points too.

[eglease]

While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - From Review

[Nicolas Hevia]

A disclaimer saying "I'm the Founder & CEO of this company" would be nice. Or at least don't say "This works like a charm!" like you just stumbled with that site yesterday 😂

[Sachin Jain]

@NicolasHevia -- Thanks for the suggestion. I missed adding a disclaimer in this answer otherwise I always put it.

[traxium]

URL Throttler mentioned in another answer is much better for this purpose because it doesn't require signing up

[Anthony Shew]

This was perfect. Use this, people!