javascript 为什么多个提取按顺序运行

6yoyoihd 于 2023-03-06 发布在 Java

关注(0)|答案(2)|浏览(101)

所以我试着像这样并行运行多个fetch请求：

fetch(
        `http://localhost/test-paralell-loading.php?r`
    );

    fetch(
        `http://localhost/test-paralell-loading.php?r`
    );

    fetch(
        `http://localhost/test-paralell-loading.php?r`
    );

但它们出乎意料地按顺序运行：

这是HTTP 1.1的限制吗？如何克服？
更新：
看起来像是在chrome上，o firefox它的行为不同：

有没有什么东西可以提高chrome浏览器的性能？

JavaScript

来源：https://stackoverflow.com/questions/75635495/why-multiple-fetch-run-in-sequence

2条答案

按热度按时间

5fjcxozz1#

您的请求正在并发运行，只是其中一些请求处于连接启动的延迟阶段。这可能是由于排队下的任何原因。请参阅预览计时细分。

- - 排队**。浏览器在以下情况下将请求排队：
有更高优先级的请求。
此来源已打开六个TCP连接，这是限制。仅适用于HTTP/1.0和HTTP/1.1。
浏览器暂时在磁盘高速缓存中分配空间。

通过查看浏览器网络选项卡中的瀑布图，可以看出并发运行和串行运行之间的区别。

const endpoints = [
  'https://swapi.dev/api/people/1/',
  'https://swapi.dev/api/people/2/',
  'https://swapi.dev/api/people/3/'
]
function requestConcurrently() {
  endpoints.forEach(endpoint => fetch(endpoint))
}

requestConcurrently()

并发请求的瀑布：

现在以系列为例：

const endpoints = [
  'https://swapi.dev/api/people/1/',
  'https://swapi.dev/api/people/2/',
  'https://swapi.dev/api/people/3/'
]
async function requestSeries() {
  for (const endpoint of endpoints) {
    await fetch(endpoint)
  }
}

requestSeries()

串联请求的瀑布：