nuxt: Production memory loss crashes - suggested high priority

This is a duplicate issue of #1678 since it was closed and mistakened as some js-beautify issue

None of my nuxtjs production environments last more than 39-40hrs. This is the ballpark moment where nuxt/vue seems to crash.

This happens on AWS instance running the Amazon Linux AMI with node v8.3.0

The original crash:

running `HOST=0.0.0.0 nuxt start I get

<--- Last few GCs --->

[8202:0x2822f10] 148084153 ms: Mark-sweep 1399.9 (1494.4) -> 1399.9 (1494.4) MB, 2284.2 / 0.0 ms  allocation failure GC in old space requested
[8202:0x2822f10] 148086478 ms: Mark-sweep 1399.9 (1494.4) -> 1399.9 (1494.4) MB, 2323.0 / 0.0 ms  last resort
[8202:0x2822f10] 148088794 ms: Mark-sweep 1399.9 (1494.4) -> 1399.9 (1494.4) MB, 2315.4 / 0.0 ms  last resort


<--- JS stacktrace --->

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

Security context: 0x37a56a69cca1 <JSObject>
    1: initWatch(aka initWatch) [/home/ec2-user/api/web/node_modules/vue/dist/vue.runtime.common.js:~3296] [pc=0x16c066f78f0b](this=0x37a56a682241 <undefined>,vm=0x361f52ccf229 <Vue$3 map = 0x3a932c4ded49>,watch=0x1374913debb1 <Object map = 0x25ca00203649>)
    2: _init [/home/ec2-user/api/web/node_modules/vue/dist/vue.runtime.common.js:~4181] [pc=0x16c06696451c](this=0x361f52ccf229 <Vue$3 map =...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [node]
 2: 0x136916c [node]
 3: v8::Utils::ReportOOMFailure(char const*, bool) [node]
 4: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [node]
 5: v8::internal::Factory::NewTransitionArray(int) [node]
 6: v8::internal::TransitionArray::Insert(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Map>, v8::internal::SimpleTransitionFlag) [node]
 7: v8::internal::Map::CopyReplaceDescriptors(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::DescriptorArray>, v8::internal::Handle<v8::internal::LayoutDescriptor>, v8::internal::TransitionFlag, v8::internal::MaybeHandle<v8::internal::Name>, char const*, v8::internal::SimpleTransitionFlag) [node]
 8: v8::internal::Map::CopyAddDescriptor(v8::internal::Handle<v8::internal::Map>, v8::internal::Descriptor*, v8::internal::TransitionFlag) [node]
 9: v8::internal::Map::CopyWithField(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::FieldType>, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Representation, v8::internal::TransitionFlag) [node]
10: v8::internal::Map::TransitionToDataProperty(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Object::StoreFromKeyed) [node]
11: v8::internal::LookupIterator::PrepareTransitionToDataProperty(v8::internal::Handle<v8::internal::JSObject>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::Object::StoreFromKeyed) [node]
12: v8::internal::StoreIC::LookupForWrite(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
13: v8::internal::StoreIC::UpdateCaches(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
14: v8::internal::StoreIC::Store(v8::internal::Handle<v8::internal::Object>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
15: v8::internal::Runtime_StoreIC_Miss(int, v8::internal::Object**, v8::internal::Isolate*) [node]
16: 0x16c0667840dd
Done in 148089.23s.

And again today

yarn start v0.27.5
$ HOST=0.0.0.0 nuxt start

 OPEN  http://localhost:3000

control-settings
control-settings
control-images

<--- Last few GCs --->

[16624:0x2b58f10] 143724943 ms: Mark-sweep 1400.0 (1486.9) -> 1400.0 (1486.9) MB, 2268.4 / 0.0 ms  allocation failure GC in old space requested
[16624:0x2b58f10] 143726690 ms: Mark-sweep 1400.0 (1486.9) -> 1400.0 (1486.9) MB, 1746.2 / 0.0 ms  last resort
[16624:0x2b58f10] 143728669 ms: Mark-sweep 1400.0 (1486.9) -> 1400.0 (1486.9) MB, 1979.9 / 0.0 ms  last resort


<--- JS stacktrace --->

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

Security context: 0x10cc8381cca1 <JSObject>
    2: $watch [/home/ec2-user/api/web/node_modules/vue/dist/vue.runtime.common.js:3362] [bytecode=0xa9573cc5771 offset=58](this=0x3374d9153869 <Vue$3 map = 0x16794112bb81>,expOrFn=0x27709a2361b1 <String[8]: nuxt.err>,cb=0x3374d91549f9 <JSFunction boundFn (sfi = 0xa9573cc3f21)>,options=0x3374d9154ca9 <Object map = 0x13ee4d484829>)
    4: createWatcher(aka createWatcher) [/home/ec2-user/api/web/no...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [node]
 2: 0x136916c [node]
 3: v8::Utils::ReportOOMFailure(char const*, bool) [node]
 4: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [node]
 5: v8::internal::Factory::NewTransitionArray(int) [node]
 6: v8::internal::TransitionArray::Insert(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Map>, v8::internal::SimpleTransitionFlag) [node]
 7: v8::internal::Map::CopyReplaceDescriptors(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::DescriptorArray>, v8::internal::Handle<v8::internal::LayoutDescriptor>, v8::internal::TransitionFlag, v8::internal::MaybeHandle<v8::internal::Name>, char const*, v8::internal::SimpleTransitionFlag) [node]
 8: v8::internal::Map::CopyAddDescriptor(v8::internal::Handle<v8::internal::Map>, v8::internal::Descriptor*, v8::internal::TransitionFlag) [node]
 9: v8::internal::Map::CopyWithField(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::FieldType>, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Representation, v8::internal::TransitionFlag) [node]
10: v8::internal::Map::TransitionToDataProperty(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Object::StoreFromKeyed) [node]
11: v8::internal::LookupIterator::PrepareTransitionToDataProperty(v8::internal::Handle<v8::internal::JSObject>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::Object::StoreFromKeyed) [node]
12: v8::internal::StoreIC::LookupForWrite(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
13: v8::internal::StoreIC::UpdateCaches(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
14: v8::internal::StoreIC::Store(v8::internal::Handle<v8::internal::Object>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [node]
15: v8::internal::Runtime_StoreIC_Miss(int, v8::internal::Object**, v8::internal::Isolate*) [node]
16: 0x2007965840dd
Done in 143729.38s.

<div align="right">_{This bug report is available on Nuxt.js community (#c1519)}</div>

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 1
Comments: 73 (21 by maintainers)

Most upvoted comments

When all these tasks will be done: https://trello.com/b/lgy93IOl/nuxtjs-10

Should be at the end of the month

+11

Atinux on Nov 7, 2017

Hi,

I believe it’s more related to inject directly, I will investigate with @pi0 on it.

Atinux on Oct 9, 2017

Yes I can confirm the memory leaks are gone with 1.1.1 so far

bovas85 on Jan 25, 2018

I have a possible solution. you have to remove @nuxt/axios. The leak comes from this plugin or is triggered from this plugin.

Then create a plugin plugins/axios.js

import axios from 'axios'
if (process.browser) {
  axios.defaults.baseURL = '/api'
} else {
  axios.defaults.baseURL = 'http://localhost:3000/api'
}

export default axios

Here you check wheater is the browser or the server (SSR) is doing the request.

in the store or pages import this plugin: import axios from '~/plugins/axios' DO NOT USE IT IN nuxt.config.js!!

Then do your request and be happy. i.e.:

async FETCH_HOMEPAGE_DATA ({ commit }) {
 let res = await axios.get('homepage')
   commit(types.RECEIVE_HOMEPAGE_DATA, { fetchedHomepageData: res.data.result })
}

Tested this in a Kubernetes Cluster (docker) and local (macos) both with node 8.9 When using the nuxt/axios plug the docker restartet when alot of requests came in. (made a curl script that fetches every second.) Now it is stable and is not crashing anymore. i think.

christophwolff on Nov 18, 2017

Thats all you need for this error to trigger. I only include @nuxtjs/axios and dont do any request at all and still get this. I also checked the config received by dispatchRequest and that really does contain isServer and isClient. But I dont know yet where that anonymous function comes from…

pimlie on Oct 31, 2017

I am working on it

Atinux on Oct 17, 2017

I experienced a similar issue, the culprit was @nuxt/axios @4.4.0. I downgraded to the latest 3.x version which is 3.1.4 and the most noticeable memory leak in my Nuxt app stopped.

With @nuxt/axios@4.4.0, the axios plugin seems to be registered with every SSR request! 😮

screen shot 2017-10-09 at 1 19 57 am

215 Axios instances! screen shot 2017-10-09 at 1 18 54 am

Since I set --max_old_space_size=400 (512 MB memory small host constraint), the app crashed after only about 200 requests (I was using integrity to crawl the links on the Nuxt app locally).

After downgraded to @nuxtjs/axios@^3.1.4, the symptom went away, and the crawling sustained to more than 1500 pages before I manually stopped. Memory was stable and clocked at around 650 MB when I stopped crawling. There might be other app specific small leakages but this one mentioned was the most obvious and severe.

This is the count for Axios in the heapdump with @nuxtjs/axios@^3.1.4 after I manually stopped the crawler on around 1500 successful SSR page requests:

Only 4 Axios instances screen shot 2017-10-09 at 1 19 10 am

onlyurei on Oct 9, 2017

@awronski Yes, it is Heroku

@pi0 Indeed, axios is not the only thing causing leaks. I also had one listener in the created() lifecycle event, in one component only, and it was enough to cause a slow rise in memory usage. I switched to mounted() and it seems to have gone away.

psnoonan on Feb 2, 2018

You could also install the next version of nuxt: yarn add nuxt@next. This installs the latest version which should work most of the time. The memory leak has at least been fixed already. Just test this in your dev setup and if tests are ok use the specific commit hash to install the same version on your production server.

pimlie on Dec 20, 2017

UPDATE: I also added axios to the vendor in nuxt config ...vendor: ['axios'],...

christophwolff on Nov 18, 2017

@onlyurei i think this might be it, i use @nuxtjs/axios everywhere as well and I’m at 4.3, excellent work

acidjazz on Oct 9, 2017