Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

!! Big JSON file causing heap out of memory for bundler !! #20859

Closed
Mangio621 opened this issue Aug 26, 2018 · 2 comments
Closed

!! Big JSON file causing heap out of memory for bundler !! #20859

Mangio621 opened this issue Aug 26, 2018 · 2 comments
Labels
Resolution: Locked This issue was locked by the bot.

Comments

@Mangio621
Copy link

Mangio621 commented Aug 26, 2018

Environment

Environment:
OS: Windows 10
Node: 10.8.0
Yarn: 1.3.2
npm: 6.2.0
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: ~0.55.2 => 0.55.4

Description

Hey everyone!

Firstly, thanks for spending the time to open this and read this. So!
I need to point out that i've just started react native 4 weeks ago from react web development.

Basically i'm making an app where i need to import a pretty big JSON file called 'cityData.json' with the size of around 23.8MB.

and one element of the JSON array looks like this...

{ "id": 707860, "name": "Hurzuf", "country": "UA", "coord": { "lon": 34.283333, "lat": 44.549999 } },

and there are plenty of these elements.
And whenever i run the code using react-native run-android, i get a memory issue from the bundler.

Heres a screenshot of what it looks like...

capture

I spent around 3 hours searching why this was happening, and alot of people suggested something about how something shouldn't be transpiled? Something about transforming? Sorry like i said i'm a newbie. They then recommended that i "ignore": the bundle from interacting with my JSON file using .babelrc or package.json? I'm not exactly sure about what they mean about that. I don't get the **/*.js syntax. But i do know for a fact, that whenever i pass in smaller JSON files, it loads perfectly. It's just this JSON file that's wayyy to big! That progress bar just won't move...

As you can see after reading that paragraph, i'm really bad with anything to do with babel and bundles. So hopefully, you guys (who are much more experienced than me) can help me with this!

Reproducible Demo

To reproduce this,

download a JSON file with the size of 23MB
create create-react-native-app
do npm run eject
make a folder named dataFolder
move JSON file called (cityData.json) into dataFolder
in App.js add the following code:

const cityData = require('./dataFolder/cityData.json');

Then run the app with react-native run-android

Then the error will occur.

@react-native-bot
Copy link
Collaborator

It looks like you are using an older version of React Native. Please update to the latest release, v0.56 and verify if the issue still exists.

The ":rewind:Old Version" label will be removed automatically once you edit your original post with the results of running react-native info on a project using the latest release.

@dulmandakh
Copy link
Contributor

IMHO, it's not efficient to store such a large data in JSON file, and include it in an app, because it'll consume a lot of RAM. I would recommend to store it on a server and access it via API, or use proper DB.

@facebook facebook locked as resolved and limited conversation to collaborators Aug 29, 2019
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Aug 29, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

3 participants