Fetching specific JSON causes massive memory leak

[Ashoat]

Environment

React Native Environment Info:
  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
    Memory: 6.28 GB / 32.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.6.0 - ~/.nvm/versions/node/v10.6.0/bin/node
    Yarn: 1.7.0 - /usr/local/bin/yarn
    npm: 6.1.0 - ~/.nvm/versions/node/v10.6.0/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
    Android SDK:
      Build Tools: 23.0.1, 25.0.0, 26.0.1, 26.0.2, 26.0.3, 28.0.1
      API Levels: 23, 26, 28
  IDEs:
    Android Studio: 3.1 AI-173.4819257
    Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.4.1 => 16.4.1
    react-native: ^0.56.0 => 0.56.0
  npmGlobalPackages:
    react-native-git-upgrade: 0.2.7

Description

Downloading this <1 KiB JSON file once a second, parsing the JSON, and appending the resultant JSON to an array, causes the demo app below to hit 500MiB of memory usage in less than 15 seconds. Each request permanently allocates ~35MiB of memory.

Reproducible Demo

I have created a repo to reproduce the issue.

[Ashoat]

There are two issues going on here, in my judgement:

1. The bigger issue, which is that a network request for a tiny JSON file is taking so much RAM.
2. Network requests aren't being garbage collected if the resultant JSON isn't. If I let the resultant JSON get garbage collected, the memory leak doesn't occur. But the network request still needs to allocate a whole bunch of memory.

[corpsemxq]

Will this be fixed by #19333?
122b379

[Ashoat]

Unfortunately, no. I just updated the test repo to 0.57 and the issue is still occurring. After downloading the tiny JSON file once a second for sixty seconds (and not disposing of the result), memory usage of the Release build of the test project climbs to over 2 GiB.

[dlajarretie]

We're also experiencing the huge memory allocation when fetching JSON. We're fetching a much bigger resource than the example provided here, and I wonder if the memory allocation is proportional because our app gets killed by iOS for memory consumption (spike from 150mb to over 700mb), even before the fetch call completes.

[Ashoat]

I’ve been able to get around this issue by immediately cloning the JSON response after receiving it.

[alainib]

i get a similar problem. i fetch a 15mo Json file. often the app get killed or get stuck in loading it.

console.log(url); // curl this url take less than 5s to download it
try {
  let response = await fetch(url);

  console.log("response", response); // log ok 
  let statusCode = response.status;

  console.log(statusCode);   // log 200    
  if (statusCode == 200) {
    let data = await response.json();
    // data = _.cloneDeep(data); // doesn't change anything

    console.log("json", data);  // never reach this log ( fast wifi connection ) !!!!!!!!!
  }
}