I have a network problem with Mac OS while requesting resources on my server (the problem is not constant). However, I can reproduce the problem by using JavaScript to request a random resource 1000 times sequentially.
var req = (id) => fetch('https://www.example.com/my/resource/starter.js?' + id);
// use the 'limit' as identifier
var doRecursiveRequest = (limit) =>
req(limit).then(res => {
if (--limit) {
return doRecursiveRequest(limit);
}
});
doRecursiveRequest(1000);
In the network tab, I see that the resource loads very fast. The counter for the requests counts up very quickly and suddenly it stops. After that it takes about 30 seconds and it continues until it stops again (always after a few hundred requests). After some time, all requests will be successfully completed.
By using Google Devtools (Performance Tab), I can see what the problem is, but I do not understand the cause.
At some point, there are 6 parallel network tasks running (all executed by my JavaScript). It seems that Chrome allows a maximum of 6 such microtasks in parallel. After that it takes up to 30 seconds until one is "killed" (?!) and the next one is allowed to start. However, on server side, the response times were all very quick (and all 1000 requests has arrived the server and a response was send).
Additional Information:
- I have this problem only on Mac OS (Google Chrome, Safari and Firefox)
- On Windows 10 it works just as expected; no pending requests (except the response time from the server)
- The printscreens are from a Windows machine, but the recorded chrome-dev profile, was on Mac OS
- System Details: MacBook Pro / OS X El Capitan (Version 10.11.6) / Google Chrome 76.0.3809.132 (64bit)