React Native fetch vs XMLHttpRequest performance

Question

I'm trying to figure out why when using axios (which uses XMLHttpRequest), parsing a large (4-5mb json) takes about 10 times more than when using just fetch and .json() on the result. Even worse, when using XMLHttpRequest the whole UI becomes unresponsive, while using fetch there might be a tiny block when doing the json parsing but the UI is responsive pretty much throughout the download process.

I can't find any documentation about the internals of fetch, but outdated blogs say it just uses XMLHttpRequest internally. If this is true, then both methods should have similar performance.

Note: This difference was seen on both Android and IOS

Answer 1

我可以找到的是，与axios相比，对fetch进行JSON解析的级别更低。使用axios，它会在请求中稍后发生，但是在react-native包中，JSON的解析发生在straight after getting the response上。

将数据从XMLHttpRequest以字符串形式返回给axios的额外层，然后axios开始解析数据，这很可能会影响性能。

fetch的本机版本也只是一个polyfill，所以不是那样。 fetch是如何直接从XMLHttpRequest解析数据的方式，这就是性能上的差异。

Answer 2

From Mozilla API Documentation

  

...一种通过网络异步获取资源的简单，合理的方法。   这种功能以前是使用XMLHttpRequest实现的。提取提供了更好的替代方案，其他技术可以轻松使用它。

获取不仅是XMLHttpRequest的包装。这证明了两种选择之间的性能差异。