对于从 `fetch` 接收到的 JSON，`Body.json()` 是否比 `JSON.parse(responseText)` 快？

Question

对于从fetch接收到的 JSON，Body.json()是否比JSON.parse(responseText )快？

理论上Body.json()可以在其从接收第一字节尽快开始解码JSON ReadableStream从fetch。这是它的工作原理吗？还是等到所有字节都收到？

const response = await fetch(url);
const json = await response.json();

const response = await fetch(url);
const text = await response.text();
const json = JSON.parse(text);

那么，这些版本的代码之间有区别吗？

Answer 1

您是正确的，在获取时主体被消耗（并且主体是一个流），但是根据规范，当浏览器要消耗主体时，它必须先 使用流读取器读取该流中的所有字节，然后才能“ [r] 返回由执行处理程序转换承诺的结果，该处理程序返回包数据算法的结果“。

这意味着在Body.json()甚至可以调用它的第一步utf-8-decode 之前，整个主体必须​​已经被读取为 Uint8Array，这同样适用于所有包数据类型。

那么我们可以得出结论

fetch( url )
  .then( body => body.json() );

实际上是语法糖

fetch( url )
  .then( body => body.arrayBuffer() )
  .then( bytes => new TextDecoder().decode( bytes ) )
  .then( text => JSON.parse( text ) );

然后

fetch( url )
  .then( body => body.text() );

本身就是语法糖

fetch( url )
  .then( body => body.arrayBuffer() )
  .then( bytes => new TextDecoder().decode( bytes ) )

因此，如果您添加自己的.then( text => JSON.parse( text ) )，您实际上会执行完全相同的操作。