Firebase-js-sdk: 4.13.0 & 4.13.1 JavaScript heap out of memory on prod build

[ben-kn-app]

[REQUIRED] Describe your environment

• Operating System version: Mac Os Sierra 10.13.3
• Firebase SDK version: 4.13.1
• Firebase Product: auth, realtime database, storage, functions, analytics

Using firebase within a ionic Android & Ios app. Ionic details:

@ionic/cli-utils  : 1.19.1
ionic (Ionic CLI) : 3.19.1

global packages:

cordova (Cordova CLI) : 7.0.1

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : ios 4.4.0
Ionic Framework    : ionic-angular 3.9.2

System:

ios-deploy : 1.9.2 
Node       : v6.11.3
npm        : 5.8.0 
OS         : macOS High Sierra
Xcode      : Xcode 9.2 Build version 9C40b

[REQUIRED] Describe the problem

ionic serve & ionic build run fine, without any problems.
ionic cordova build ios --prod
Throws: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

Running app-scripts build: --prod --platform ios --target cordova
[09:52:32]  build prod started ... 
[09:52:32]  clean started ... 
[09:52:32]  clean finished in 4 ms 
[09:52:32]  copy started ... 
[09:52:32]  copy finished in 177 ms 
[09:52:32]  deeplinks started ... 
[09:52:33]  deeplinks finished in 307 ms 
[09:52:33]  ngc started ... 
[09:52:44]  ngc finished in 11.24 s 
[09:52:44]  preprocess started ... 
[09:52:44]  preprocess finished in less than 1 ms 
[09:52:44]  webpack started ... 
<--- Last few GCs --->

  286768 ms: Mark-sweep 4024.5 (4134.3) -> 4024.5 (4134.3) MB, 4466.6 / 0.0 ms [allocation failure] [GC in old space requested].
  291077 ms: Mark-sweep 4024.5 (4134.3) -> 4024.5 (4134.3) MB, 4308.7 / 0.0 ms [allocation failure] [GC in old space requested].
  295172 ms: Mark-sweep 4024.5 (4134.3) -> 4028.4 (4118.3) MB, 4094.4 / 0.0 ms [last resort gc].
  299375 ms: Mark-sweep 4028.4 (4118.3) -> 4032.5 (4118.3) MB, 4202.6 / 0.0 ms [last resort gc].


<--- JS stacktrace --->

==== JS stack trace =========================================

    2: arguments adaptor frame: 3->1
Security context: 0x13e2c34cf781 <JS Object>
    3: map [native array.js:~994] [pc=0x3e9139fa86c1] (this=0x1e42a850cbc1 <JS Array[1]>,bq=0x1a24728a54b1 <JS Function (SharedFunctionInfo 0x376baaf067d9)>,br=0x13e2c3404381 <undefined>)
    4: arguments adaptor frame: 1->2
    5: signatureToSignatureDeclarationHelper(aka signatureToSignatureDeclarationHelper) [/Users/ben/Documents/Projects/netwerkApp/netwe...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [/usr/local/bin/node]
 2: node::FatalException(v8::Isolate*, v8::Local<v8::Value>, v8::Local<v8::Message>) [/usr/local/bin/node]
 3: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [

Steps to reproduce:

npm install -g ionic cordova
Ionic start helloWorld blank
cd helloWorld
ionic cordova platform add [email protected]
ionic cordova build android --prod (no error, goes well)
npm i [email protected]
Add to src/app/app.module.ts 
import firebase from 'firebase';

firebase.initializeApp({
    apiKey: "AIzaSyBNHCyZ-bpv-WA-HpXTmigJm2aq3z1kaH8",
    authDomain: "jscore-sandbox-141b5.firebaseapp.com",
    databaseURL: "https://jscore-sandbox-141b5.firebaseio.com",
    projectId: "jscore-sandbox-141b5",
    storageBucket: "jscore-sandbox-141b5.appspot.com",
    messagingSenderId: "280127633210"
});

ionic cordova build android --prod (gives  FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory)
npm i [email protected]
ionic cordova build android --prod  (works)

This only occurs (everything else being equal) after npm install [email protected] or npm install [email protected]
npm instal [email protected] resolves this problem (workaround).
also node --max-old-space-size=8192 /usr/local/bin/ionic cordova build ios --prod gives the same error.
Which makes me believe there is a memoryleak somewhere introduced in 4.13.0, I've reproduced it with a minimal code example using android (so even ppl without a mac can test).

If you require more information let me know, I am happy to assist.

[codinronan]

@chinib I have just run into this and I proved it is happening by reverting to a commit 36 hours ago that I built and deployed to production successfully.

I have literally. OH MY GOD painstakingly gone through all 996 of my dependencies (yes you read that right!!) and checked which have changed in the last 24 hours. 😵 Firebase is the only one.

How did I notice? I turned webpack on full blast and took note of when it just.... stopped. It just stops and memory goes through the roof. I have tried giving Node 12GB of memory and it even blasts through that.

Not sure what changed in 4.13.1 but thank you @chinib for finding this - will revert to 4.12.1 for now and remove the carat from my package.json!!

[zarko-tg]

We seems to have ran into the same issue. This is basically a show-stopper for our Ionic prod builds.

[tgensol]

I am facing the same issue since the Firebase 4.13.0, and the issue is still present in the 4.13.0 and 4.13.1.

The app-scripts build of Ionic, when running in Prod, is running forever at the "webpack" step. It is working juste fine with firebase <= 4.12.1

[codinronan]

Funny part is that I NEED this update, it has a fix for navigator.onLine that is causing my Rollbar logs to get filled with fake errors (over 3000 of them per day!!)

https://firebase.google.com/support/release-notes/js#4.13.0

Error occurs but login is still successful. I believe this version fixes this issue... hopefully the amazing team can get a new version out soon that can build :)

[m-thompson-code]

Downgrading to [email protected] wasn't enough for me. Had to make sure I was using @firebase/[email protected] too. This was preventing me from making an AOT build.

[CKunhardt]

Confirming that downgrading to [email protected] worked for me. Feel free to look at this repo for an example of an affected app.

[paulstelzer]

This issue still persist on [email protected] / [email protected] - Does anyone has a workaround (except downgrading to [email protected])?

UPDATE: The information of @moomoomamoo was the right one! I removed @firebase/[email protected] (which is installed with [email protected]) and replaced it with @firebase/[email protected] from [email protected] and NO memory heap :)

I will check tomorrow what changed there.

[Fomare]

It works for me with firebase 4.12.1 Thank you very much!!!!

[ben-kn-app]

@paulstelzer any luck finding something in @firebase/[email protected] ?

[paulstelzer]

@chinib I find out that I load the Firebase Database althought I not used it - so I removed loading it and so I not get the error anymore. But if you need the package and the heap out of memory error occurs, then you have to use the older version of firebase@database

[tgensol]

Same here, you can use firebase ^5.0, but you need ton install @firebase/[email protected]...

[david-ae]

Thanks @tgensol. Adding @firebase/[email protected] to @chinib's solution worked for me.

[SteveKennedy]

Confirming that this is still an issue with 5.0.4.

[ramzed]

Same issue. I'm using firebase 5.0.4...
I was trying build using node --max-old-space-size=8192
But still getting "JavaScript heap out of memory"
516689 ms: Mark-sweep 8071.4 (8196.0) -> 8079.0 (8196.0) MB, 6603.7 / 0.0 ms [last resort gc].

[zarko-tg]

Bit disappointing to see there's no real reaction to this case by Firebase folks. What gives?

[SteveKennedy]

Just another comment, pointing out that some have been able to solve this using firebase 5.0.x, but you need ton install "@firebase/database": "0.2.1".

[tgensol]

Could be cool to understand what changed between @firebase/[email protected] and @firebase/[email protected] and is still here. (And causing this error)...

[JNSantiago]

@tgensol hint worked for me.
"@firebase/database": "0.2.1"
"firebase": "^5.0.4"

ionic cordova build android --prod --release

[jayordway]

Confirming that this is still an issue with 5.1.0.

I had to use the older "@firebase/database" to be able to run a prod build as well, it is working with this set of packages, even though it is not recommended to reference the standalone packages directly it seems to work so far.

    "@firebase/app": "^0.3.3",
    "@firebase/auth": "^0.7.0",
    "@firebase/database": "^0.2.1",
    "@firebase/functions": "^0.2.4",
    "@firebase/logger": "^0.1.1",
    "@firebase/storage": "^0.2.3",

[tgensol]

Still an issue with firebase 5.2.0... @mikelehen or anybody from firebase could look at it ? (or at least say something please :( ) ?

Thanks !

[mikelehen]

Sorry nobody's looked at this. I hadn't seen it since there were no labels on it, and I mostly only monitor Firestore or Database issues.

This sounds very strange. I am not sure why our (working) JavaScript code would be causing the ionic build to run out of heap and crash. My instincts say this is really an ionic issue which we are accidentally triggering.

It looks like @jshcrowthe did a large-ish build refactoring between 4.12.1 and 4.13.0 and so that seems likely to be related. But like I said, it's very possible we're not doing anything "wrong"; it's just that we've triggered poor memory patterns in ionic somehow... or exceeded some threshold.

I see there's a related ionic issue over here. It may be worth looking through that for potential workarounds, though it doesn't seem to be resolved either.

I'm not sure the best way to move forward on this. Ideally somebody from ionic could use a memory profiler to see what the build is doing and why it's running out of heap. Failing that, somebody could experiment with piecing apart Josh's build refactor commit to see if we can isolate what exactly triggered the regression. But that could be slow and painful, and perhaps not very fruitful (it may still not tell us what's actually going wrong in ionic).

Sorry I don't have anything more concrete to contribute at this point. This looks like a gnarly issue and may be difficult to tackle from the Firebase side. :-/

[bnfrnz]

Just in case this helps anyone in trying to debug this:

For me (and a few others here), the issue occurs when using any higher than @firebase/[email protected] and together with ionic's --prod or --optimizejs flag.

[prasuncnair]

@bnfrnz Thanks. Downgrading to @firebase/[email protected] does help solve the issue in --prod compile.

[alexnu]

Version 5.3.0 still facing the same issue.

[jayordway]

I updated the @angular-devkit/build-optimizer which @ionic/app-scripts leverages with version 0.0.35, for app-scripts version 3.1.8 and I updated @angular-devkit/build-optimizer to version 0.6.8. Now I can do a production build with ionic 3.9.2 and firebase 5.3.0

[bnfrnz]

Thanks @jayordway! This seems to finally do the trick for me as well.

[tgensol]

@jayordway I tried but I am getting typescript error. What is your version for typescript and angular ? And are you using only @ionic/[email protected] ? It is not working with @ionic/[email protected] ? Thanks !

[SteveKennedy]

@tgensol and @bnfrnz

After adding angular-devkit/build-optimizer, I also ended up getting a typescript error when ngc starts...

TypeError: Cannot read property 'kind' of undefined at Object.getExternalModuleName (c:app\node_modulestypescriptlibtypescript.js:9129:26)
at collectModuleReferences (c:app\node_modulestypescriptlibtypescript.js:74890:49)
at collectExternalModuleReferences (c:app\node_modulestypescriptlibtypescript.js:74876:17)
at processImportedModules (c:app\node_modulestypescriptlibtypescript.js:75182:13)
at findSourceFile (c:app\node_modulestypescriptlibtypescript.js:75098:17)
at processImportedModules (c:app\node_modulestypescriptlibtypescript.js:75222:25)
at findSourceFile (c:app\node_modulestypescriptlibtypescript.js:75098:17)
at args (Ec:app\node_modulestypescriptlibtypescript.js:74987:85)
at getSourceFileFromReferenceWorker (c:app\node_modulestypescriptlibtypescript.js:74960:34)
at processSourceFile (c:app\node_modulestypescriptlibtypescript.js:74987:13)

My application's package.json includes:

@angular/core 6.0.9,
ionic-angular 3.9.2, 
firebase 5.3.0, 
@firebase/app 0.3.3,
@firebase/database 0.2.1,
@firebase/firestore 0.6.0

and also...

@ionic/app-scripts 3.1.11, (devDependencies)
typescript 2.7.2, (devDependencies)

The reason why I use typescript 2.7.2, is because angular 6.0.9 doesn't support typescript 2.9.2.

Initially, my application's package.json did not have any reference to @angular-devkit/build-optimizer. But with just these packages mentioned above, it builds fine.

However, just like everyone else, when I upgraded @firebase/database 0.2.1 to 0.3.4, I get a build error message regarding JavaScript heap out of memory. This only happens if I include --prod or --optimizejs flag.

So, based on the latest comments, I simply added a reference in my own application's package to angular-devkit/build-optimizer by running:

npm i @angular-devkit/build-optimizer

Then I run the same build again (including the same --prod flag), I get the typescript error mentioned above.

[tgensol]

@SteveKennedy Same here. That's why I asked @jayordway for more informations about his package.json

[bnfrnz]

This is an excerpt of my package.json with the libraries that I think may be relevant here:

"ionic-angular": "^3.9.2",
"@angular/core": "^5.2.11",
"@ionic/app-scripts": "^3.1.11",
"firebase": "^5.3.0",
"angularfire2": "5.0.0-rc.11",
"typescript": "2.6.2",
"rxjs": "^6.2.2",
"rxjs-compat": "^6.2.2",

There seem to be a few people out there with the error that you're seeing. Some assume that it's related to the angular aot. I can't really help because I don get the error.

The only two things I wonder -- and these may or may not at all be related to your issue -- are the following:

1) You are still pinning the Firebase versions in your package.json. I know from experience that the Firebase libraries are quite tricky when it comes to peer dependencies compatibility between the versions. If you don't have a particular need to pin the versions, maybe try if it works without.

npm uninstall --save firebase
npm uninstall --save @firebase/app
npm uninstall --save @firebase/database
npm uninstall --save @firebase/firestaore
npm i --save firebase

After that, you should simply see "firebase": "^5.3.0" in your package.json. Note that [email protected] comes under the hood with @firebase/[email protected], @firebase/[email protected] and @firebase/[email protected].

2) You are using Angular 6. It is my understanding that Ionic 3 does not yet officially support that. Unfortunately, Ionic is not very specific at all in any of their documentation when it comes to explicitly stating the versions of angular packages, typescript, rxjs, etc. they're working with. But I remember reading in a forum somewhere one of the Ionic guys recommending to wait for Ionic 4 with updating to Angular 6.

Again, I'm not sure any of this is related. But good luck!

[jayordway]

I have to agree with @bnfrnz here. Ionic projects generated from scratch come with angular/core 5.2.11. So I am not sure if these newer versions of angular and typescript will mesh so well. Here is a list of some of my dependencies:

"@angular/animations": "5.2.9",
"@angular/common": "5.2.9",
"@angular/compiler": "5.2.9",
"@angular/compiler-cli": "5.2.9",
"@angular/core": "5.2.9",
"@angular/forms": "5.2.9",
"@angular/http": "5.2.9",
"@angular/platform-browser": "5.2.9",
"@angular/platform-browser-dynamic": "5.2.9",

"devDependencies": {
"@ionic/app-scripts": "^3.1.10",
"typescript": "~2.6.2"
},

[Bengejd]

I originally opened this issue on the ionic-team/ionic-app-scripts Github about 3 months ago. Unfortunately it hasn't been addressed by the Ionic team, but I am glad to hear that the Firebase team took a look into it and came to the conclusion that it wasn't something on their end.

Here is my working answer for the issue. It fixed it for myself, but as we all know. A solution for some may not be a solution for many.

[CodyDubu]

I was able to get my project working by adding keystore passwords to the cli.
In addition to downgrading to @firebase/[email protected] as suggested by @SteveKennedy

Like this: ionic cordova build android --prod --release -- -- --keystore="..\android.keystore" --storePassword=password --alias=alias --password=password

Reference
Android Guide

[alclimb]

As @mikelehen says, I think Firebase is not the root cause.
I solved it by adding @angular-devkit/[email protected].

npm install --save @angular-devkit/[email protected]

Below is an excerpt of package.json.

  "dependencies": {
    "@angular-devkit/build-optimizer": "0.6.8",
    "@angular/animations": "5.2.9",
    "@angular/common": "5.2.9",
    "@angular/compiler": "5.2.9",
    "@angular/compiler-cli": "5.2.9",
    "@angular/core": "5.2.9",
    "@angular/forms": "5.2.9",
    "@angular/http": "5.2.9",
    "@angular/platform-browser": "5.2.9",
    "@angular/platform-browser-dynamic": "5.2.9",
    "@ionic-native/core": "4.6.0",
    "@ionic-native/splash-screen": "4.6.0",
    "@ionic-native/status-bar": "4.6.0",
    "@ionic/storage": "2.1.3",
    "cordova-android": "6.4.0",
    "cordova-ios": "4.5.4",
    "cordova-plugin-ionic-keyboard": "2.1.2",
    "cordova-plugin-ionic-webview": "1.2.1",
    "cordova-plugin-splashscreen": "5.0.2",
    "cordova-plugin-statusbar": "2.4.2",
    "cordova-plugin-whitelist": "1.3.3",
    "firebase": "5.3.1",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "rxjs": "5.5.8",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.20"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.11",
    "ionic": "3.20.0",
    "typescript": "2.6.2"
  },

[3m0]

@alclimb 's solution didn't work for me. Maybe there's something more.

[jdmaldonado]

@alclimb It works for me, but with the latest version (0.8.3) in this case. Thanks.

In my case, I'm building a PWA (not Android or iOS). And the issue started when I installed @angular/fire which uses firebase. but It can be a coincidence.

[basvdijk]

I've found a solution when using Ionic which was pointed out in an old message on the forum: https://forum.ionicframework.com/t/3-7-0-ios-build-with-prod-not-working/107061/24

Open node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js

Change the first line from:
#!/usr/bin/env node
into
#!/usr/bin/env node --max-old-space-size=4096

I tried values 1024 and 2048, but for my relatively large app I needed 4096.

Now I am able to run ionic cordova build android --prod --release with out the FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory error.

Posted this solution in #1467, #1036, #714 and #1247

[zakton5]

For any future readers, my issue is that I had the firebase (5.5.3) package installed and did not properly import the specific modules. The fix is shown here: #848. I guess importing everything was much too large.

[kyleabens]

@basvdijk I can confirm that your solution worked for me. Thanks!

[carlos-olivera]

@alclimb 's solution works for me

[JNSantiago]

only add "@firebase/database": "0.2.1", for your package.json, and works.

[snakone]

I updated the @angular-devkit/build-optimizer which @ionic/app-scripts leverages with version 0.0.35, for app-scripts version 3.1.8 and I updated @angular-devkit/build-optimizer to version 0.6.8. Now I can do a production build with ionic 3.9.2 and firebase 5.3.0

this worked perfectly, thank you very much

[hbcarvaj]

Thanks! @JNSantiago
Now it works with the --prod and --release flags also i have to point out that i'm working with [email protected]

Regards