對於從 `fetch` 接收到的 JSON，`Body.json()` 是否比 `JSON.parse(responseText)` 快？

Question

對於從fetch接收到的 JSON， Body.json()是否比JSON.parse(responseText )快？

理論上Body.json()可以在從fetch接收到ReadableStream的第一個字節后立即開始解碼 JSON。 這是它的工作原理嗎？ 還是等到所有字節都收到？

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 之前，整個 body 必須已經被讀取為 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 ) ) ，您實際上會執行完全相同的操作。