"Property storage exceeds 196607 properties" error when using fetch more than a certain number of times in React Native

[ishikawa]

Description

We are developing an application using React Native and Expo. This application needs to run 24/7 and performs network requests using fetch() regularly for monitoring purposes.

The issue we are facing is that after running the application for a while, from some point, network requests starting to fail. Through investigation using logs from Sentry, we have identified the following problem:

• We are using fetch() for network requests.
• At the completion of a fetch() request, an error occurs: Property storage exceeds 196607 properties.

The stack trace when this error occurs is as follows:

message: Property storage exceeds 196607 properties,
name: RangeError,
stack:
RangeError: Property storage exceeds 196607 properties
    at register (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:13781:20)
    at createFromOptions (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:13614:30)
    at get (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:13182:67)
    at anonymous (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:15155:45)
    at call (native)
    at dispatchEvent (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:14686:31)
    at setReadyState (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:13481:31)
    at __didCompleteResponse (/Users/expo/Library/Developer/Xcode/DerivedData/xxx/main.jsbundle:13289:29)
    at apply (native)
    at anonymous

Through further investigation, the following findings have been uncovered:

• The polyfill used for fetch, whatwg-fetch, returns responses as Blob objects.
• When a Blob is created, it is registered with blobID in the BlobRegistry, which is not automatically released.
• This issue was previously reported in fetch() leaks memory on each request due to unreleased Blobs #19248 and was fixed by modifying whatwg-fetch. However, with the implementation of automatic garbage collection in [Blob] Release underlying resources when JS instance in GC'ed on iOS #24405, the implementation was reverted in commit bccc92d, returning to the original behavior.
• Although [Blob] Release underlying resources when JS instance in GC'ed on iOS #24405 enables Blob objects to be garbage collected, the Blob IDs registered in the BlobRegistry remain, causing the count to increase each time fetch is called.
• As a result, the Property storage exceeds 196607 properties error occurs

Our solution

To address this issue and prevent the error, we have modified the implementation of BlobRegistry to use a Map instead of an object. By using a Map, there is no limit to the number of entries.

const registry: Map<String, number> = new Map();

const register = (id: string) => {
  const used = registry.get(id);

  if (used != null) {
    registry.set(id, used + 1);
  } else {
    registry.set(id, 1);
  }
};

const unregister = (id: string) => {
  const used = registry.get(id);

  if (used != null) {
    if (used <= 1) {
      registry.delete(id);
    } else {
      registry.set(id, used - 1);
    }
  }
};

const has = (id: string): number | boolean => {
  return registry.get(id) || false;
};

module.exports = {
  register,
  unregister,
  has,
};

React Native Version

0.72.4

Output of npx react-native info

System:
OS: macOS 13.4.1
CPU: (8) arm64 Apple M2
Memory: 92.86 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 18.17.0
path: /usr/local/bin/node
Yarn:
version: 1.22.19
path: /usr/local/bin/yarn
npm:
version: 9.6.7
path: /usr/local/bin/npm
Watchman: Not Found
Managers:
CocoaPods:
version: 1.12.1
path: /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 22.4
- iOS 16.4
- macOS 13.3
- tvOS 16.4
- watchOS 9.4
Android SDK: Not Found
IDEs:
Android Studio: 2021.2 AI-212.5712.43.2112.8815526
Xcode:
version: 14.3/14E222b
path: /usr/bin/xcodebuild
Languages:
Java: Not Found
Ruby:
version: 3.2.2
path: /Users/takanori.ishikawa/.rbenv/shims/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.72.4
wanted: 0.72.4
react-native-macos: Not Found
npmGlobalPackages:
"react-native": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found

Steps to reproduce

Invoke fetch() more than 196,607 times 😄

Snack, screenshot, or link to a repository

To demonstrate this issue, I created a simple Expo application.
https://github.com/ishikawa/react-native-fetch-property-storage-exceeds-error

You can run it with expo:

$ npm i
$ npm run ios

[ishikawa]

I also added PR #39528

[ishikawa]

The fix is merged #39528 in deca8c5. Thanks!

[robsadams]

Will this be in release 0.72.4 and beyond? ... I have the same issue.

[Ladvace]

getting same issue too

[robsadams]

Is this rolled back to react-native .71.2? If so, does anybody know how to pick it up on vscode? I am already using react-native tools which seems to be using react-native .71.2.... I can't find instructions to pick up patches or upgrade react native within vscode.

[brunomartins-com]

Do you guys know which version it is fixed? I am using 0.72.6 and getting this error.

[robsadams]

Above they gave a thumbs up to .72.4 so I assume from that point on... I upgraded to .73 and have not seen it.... although I have not tried to recreate it.

[softmarshmallow]

Can anyone tell what this is regards to? which module is throwing this error? no clue, can't debug.

[Nantris]

Can anyone confirm what version this is fixed on? Or even that it really is fixed?

[robertdue]

Can anyone confirm what version this is fixed on? Or even that it really is fixed?

I have the same problem with 0.72.10

[faisal-rehman19]

Facing the same issue with 0.73.1. Data from the server contains buffer data which might be the reason for this error.

[gabriel-messas]

0.73.4 still with error here

[Nantris]

@ishikawa are you sure this is fixed and should be closed?

[DrRefactor]

Observing the same issue on long running app in 0.72.6.

[jack2684]

Same issue with 0.73.2

[Nantris]

@ishikawa would you please re-open this issue?

[simon-accesso]

@ishikawa would you please re-open this issue?

This! Observed with 72.6 and higher.

[tribou]

facebook/hermes#851 may be related

[Nantris]

@tribou yes I think so. Good find.

[therbta]

I'm facing the same issue on Android.

[gikami]

У меня такая же ошибка RangeError: An error was thrown when attempting to render log messages via LogBox.

Property storage exceeds 196607 properties

This error is located at:
in Unknown (at LogBoxInspectorSourceMapStatus.js:97)

Отключил logbox пока все норм.

[CommanderRedYT]

I also have this issue with 0.72.6

[landabaso]

Still an issue in 0.74.1 using Hermes engine.

[robsadams]

How do we get this reopened? It is likely not being looked at because it is closed.

[daveyd80]

Same Issue here 0.73.1 in a long running app. Issue needs re-opening please!

RangeError: Property storage exceeds 196607 properties

This error is located at:
    in Unknown (created by LogBoxInspectorSourceMapStatus)
    in RCTView (created by View)
    in View (created by LogBoxButton)
    in TouchableWithoutFeedback (created by LogBoxButton)
    in LogBoxButton (created by LogBoxInspectorSourceMapStatus)
    in LogBoxInspectorSourceMapStatus (created by LogBoxInspectorStackFrames)
    ...

[arun057]

Facing the same issue on 0.74.1 with Hermes.

[Med5KDB]

Facing the same issue when trying to upload file to aws s3 (even if I think it's not related to file-upload action, seems to be related to the fetch

[Mikail-1022063]

Facing the same issue, any updates on this? I also have a image upload, and somethimes after being a couple of minutes afk in the app i get this error Property storage exceeds 196607 properties

[inkCrazy]

Has the problem been solved？

[iamsreeragkp]

Still facing this problem in 0.73.0

[danyalutsevich]

What can be the cause of this error?
Im having this error in react-native 0.74.2
Im using expo 51.0.14

[Nantris]

What can be the cause of this error?

I believe the cause is that objects can only support a maximum of 196607 properties in the Hermes engine

[NewvilleMedia]

I get this error when the simulator is open and I let it sit idle for a bit.

[Dat-Mobile]

For me I console.log the Buffer variable, removed it and now working fine

[AlastairTaft]

For me I console.log the Buffer variable, removed it and now working fine

Thank you, you've saved me a headache

[f1shy-dev]

For me I console.log the Buffer variable, removed it and now working fine

Can you show details of this implementation/fix? What do you mean?

[AlastairTaft]

For me I console.log the Buffer variable, removed it and now working fine

Can you show details of this implementation/fix? What do you mean?

Console logging on an extremely large array causes the error / crash. Which makes sense.

[jeafgilbert]

I used clone function from 'lodash', got the same error. Now working fine after switch to ramda.

[ywisax]

Same problem in react-native 0.74.5

[stdiodavid]

Same problem in React Native v0.75.2

[landabaso]

Hi @ishikawa,

I see that several users, including myself, are still facing this issue in the latest versions. Would you consider reopening this issue to raise awareness and revisit the problem?

Thank you!

[Whitelistedd]

also experiencing the same thing

[bumpingChris]

I'm experiencing the same thing too

[just-dodo]

experiencing the same thing

[ishikawa]

Apologies for the delay in responding. Since the fix I proposed was merged, I have not been able to reproduce the issue when using fetch, and I believe the PR resolved the problem. Our app has been running for over a year since the issue, and we haven't encountered the same problem.

I also updated my previous reproduction code to the latest Expo SDK 51 (w/ react-native 0.74.5), but the issue still does not reproduce.

• https://github.com/ishikawa/react-native-fetch-property-storage-exceeds-error

While I don’t have much capacity to dive deeper into this, if anyone is seeing this issue with fetch under different conditions, it would be interesting to hear more details.

[angelopedroso]

I'm using tanstack query to do a get requisition from 5 to 5s, after 6h (maybe), emit this error. 0.73.6. I'm using axios with react query

[XantreDev]

React native: 0.73.6

function App() {
  useEffect(() => {
    const tenMb = new Uint8Array(10 * 1024 * 1024);
    const formData = new FormData();
    formData.append("0", tenMb);

    fetch("https://www.google.com/", {
      method: "POST",
      body: formData
    })
      .then(res => {
        console.log("successfully send 10mb", res);
      })
      .catch(err => {
        console.log("failed to send 10mb", err);
      });
  }, []);
  return null

 LOG  failed to send 10mb [RangeError: Property storage exceeds 196607 properties]

This is because Uint8Array is not converted to Blob. If convert - it works

[yMosk]

any news on how to fix this?

[vitordesouza]

This does not seem to be exclusively related to fetch.
I am getting this error simply by leaving the app running, no requests, no usage. Couple hours in standby and I get this error. React native 0.74.5

[edgarciametro]

This does not seem to be exclusively related to fetch. I am getting this error simply by leaving the app running, no requests, no usage. Couple hours in standby and I get this error. React native 0.74.5

this is my exact experience, started a new build and for now it is gone.