花太多时间调用 promise 的 then 函数

Question

我正在使用 fetch API 在我的 React Native 应用程序中调用查询服务器。但是，我的应用程序在收到服务器的响应后需要 50 秒才能调用 then 函数。是我做错了什么还是 Promise 工作很慢？

fetch(url, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/x-www-form-urlencoded',
      },
      body: bodyContent
    }.then((responseText) =>  {
        console.log(responseText);
        responseText.json().then(function(response){
             console.log(response);
        });
    });

response 在 responseText

后 50 秒在日志中打印

更新：刚刚发现 responseText.json() 承诺只有在我再次点击屏幕后才会执行。这个问题很奇怪。

Answer 1

promise 比 callback 慢一点。但不是 50 秒！我认为您的互联网连接有问题。

Answer 2

尝试从浏览器（通常是 F12 键）打开您的 webtool kit developper，然后进入网络选项卡。

您可以看到查询所用的时间。如果需要很长时间，可能是您的网络连接或服务器设置了延迟响应。

如果不是，就是客户端。

Answer 3

由于我们将其缩小到花费太多时间的 json() 调用，因此似乎这是一个报告的问题 (https://github.com/facebook/react-native/issues/6418)，但到目前为止并不经常发生不可重现。这可能与您的 json 对象的结构或大小有关。

就我个人而言，我使用您在我的 React 本机应用程序中大量使用的代码结构，并且没有性能损失。但是，我的典型响应非常小且简单（例如，包含 10 个对象的列表，大约有 20 个键，没有嵌套等）

您可以尝试我链接到的问题报告中的建议并使用 responseText.text() 并比较性能。

Answer 4

我遇到了同样的问题，responseText在几毫秒内立即返回，但是当它使用.json()转换为json时，需要几秒钟，有趣的是如果我在 .json() 解析期间单击屏幕，它会立即返回 json 数据

Answer 5

终于，我找到了解决这个问题的方法。就是因为Chrome Debugging。如果我停止 chrome 调试，它工作正常。如果 Chrome 调试器是运行，我必须点击屏幕以获得 return 值。因此，如果您是运行 chrome 调试器，请忽略此延迟。

花太多时间调用 promise 的 then 函数

Taking too much time to call promise's then function

javascript

react-native

fetch-api