带有 fetch 和 chrome 的多个请求一次只能处理 6 个文件，其他请求将被停止答案

【问题标题】：multiple request with fetch and chrome only work with 6 files at a time and other requests will be stalled带有 fetch 和 chrome 的多个请求一次只能处理 6 个文件，其他请求将被停止
【发布时间】：2019-04-24 13:11:51
【问题描述】：

我每 5 秒通过 fetch 向服务器发出 10 个请求并重新加载该请求。 1 分钟后，浏览器冻结。
Chrome 只能同时处理 6 个请求，并暂停所有其他请求。
在请求完成之前，一切都被冻结（滚动页面，放大地图）。
Chrome 是否可以同时处理所有请求？

有什么我做错了吗？

我尝试使用异步获取和 Xhr 请求，但结果都相同。

const headers = new Headers();
headers.set('Content-Type', 'application/json');

let _options = {
  credentials: 'include',
  cache: 'no-cache',
  mode: 'cors',
  redirect: 'follow',
  referrer: 'no-referrer',
  headers
};


fetch(url, _options).then(
  response => {
    if (response.status !== 200) {
      console.log(`Looks like there was a problem. Status Code: ${
        response.status}`);
      return;
    }

    // Examine the text in the response
    response.json().then(data => data);
  }
)
  .catch(err => {
    console.log('Fetch Error :-S', err);
  });

enter image description here

【问题讨论】：

大多数浏览器不仅仅是 Chrome，限制了对同一域的并发请求数。地图服务器通常通过拥有多个域来解决这个问题，例如.. map1.mapper.com, map2.mapper.com, etc. blog.bluetriangle.com/blocking-web-performance-villain
如果我是对的，这不是并发请求的数量，而是在这些请求期间整个页面阻塞。恕我直言，多个域不能解决这个问题？

标签： javascript google-chrome request fetch

【解决方案1】：

尽量减少请求

我假设您可以控制服务器端代码，并且所有请求都将发送到同一台服务器。在这种情况下，请求是什么？

您每 5 秒发出的这 10 个请求，它们是否从同一来源获得不同位的数据？例如……一个请求获得最新评论，另一个请求获得最新注册用户名，另一个请求获得前十名，等等？如果是这种情况，那么在一个请求中在服务器端执行所有 10 项操作，然后一次性将它们全部返回给客户端。处理单个请求可能需要更长的时间，但您会大大减少客户端的带宽和负载。

或者，或者另外，解决您一遍又一遍地提出相同请求的事实。如果您每 5 秒请求一次相同的数据，并且您只对这些数据何时发生变化感兴趣，请尝试使用 websockets。与其每 5 秒重复一次请求，不如打开一个 websocket 连接，让服务器每 5 秒或在服务器知道数据已更改时向您发送该数据。

【讨论】：