VueJS watcher out of memory crash
Problem
My team and I are working on a project for our company, we are developing the frontend of this project in VueJS + NuxtJS + Vuetify, so far everything was good, we deployed the project today and strangest thing took us by surprise, while the project is working perfectly in the local environment, if you try to access it the deployed production version, it doesn't render, instead the browser gets frozen.
Details
After some debugging, we found out Chrome was pausing the project given a possible memory crash, as shown in the following image.
We decided to start debugging deeper, and we found out the error was:
Which makes reference to the function cleanupDeps() from the vue watcher.
Questions
My questions are:
- Why is this happening only on production and not development (talking about nuxtjs environments and webpack compilation)
- Is there anyone else who faced this in the past? (I've been researching in Github issues and internet in general and haven't found nothing, that's why I'm posting this question here.)
Thank you very much in advance if someone manages to solve this.
Update on issue found
After some more investigation after I posted the question, I found out that the error was being provoked by Vuetify tabs, the why, we still don't know but this is a detail that scopes the question a little bit more.
vue.js vuejs2 vuex vuetify.js nuxt.js
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
add a comment |
Problem
My team and I are working on a project for our company, we are developing the frontend of this project in VueJS + NuxtJS + Vuetify, so far everything was good, we deployed the project today and strangest thing took us by surprise, while the project is working perfectly in the local environment, if you try to access it the deployed production version, it doesn't render, instead the browser gets frozen.
Details
After some debugging, we found out Chrome was pausing the project given a possible memory crash, as shown in the following image.
We decided to start debugging deeper, and we found out the error was:
Which makes reference to the function cleanupDeps() from the vue watcher.
Questions
My questions are:
- Why is this happening only on production and not development (talking about nuxtjs environments and webpack compilation)
- Is there anyone else who faced this in the past? (I've been researching in Github issues and internet in general and haven't found nothing, that's why I'm posting this question here.)
Thank you very much in advance if someone manages to solve this.
Update on issue found
After some more investigation after I posted the question, I found out that the error was being provoked by Vuetify tabs, the why, we still don't know but this is a detail that scopes the question a little bit more.
vue.js vuejs2 vuex vuetify.js nuxt.js
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45
add a comment |
Problem
My team and I are working on a project for our company, we are developing the frontend of this project in VueJS + NuxtJS + Vuetify, so far everything was good, we deployed the project today and strangest thing took us by surprise, while the project is working perfectly in the local environment, if you try to access it the deployed production version, it doesn't render, instead the browser gets frozen.
Details
After some debugging, we found out Chrome was pausing the project given a possible memory crash, as shown in the following image.
We decided to start debugging deeper, and we found out the error was:
Which makes reference to the function cleanupDeps() from the vue watcher.
Questions
My questions are:
- Why is this happening only on production and not development (talking about nuxtjs environments and webpack compilation)
- Is there anyone else who faced this in the past? (I've been researching in Github issues and internet in general and haven't found nothing, that's why I'm posting this question here.)
Thank you very much in advance if someone manages to solve this.
Update on issue found
After some more investigation after I posted the question, I found out that the error was being provoked by Vuetify tabs, the why, we still don't know but this is a detail that scopes the question a little bit more.
vue.js vuejs2 vuex vuetify.js nuxt.js
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
Problem
My team and I are working on a project for our company, we are developing the frontend of this project in VueJS + NuxtJS + Vuetify, so far everything was good, we deployed the project today and strangest thing took us by surprise, while the project is working perfectly in the local environment, if you try to access it the deployed production version, it doesn't render, instead the browser gets frozen.
Details
After some debugging, we found out Chrome was pausing the project given a possible memory crash, as shown in the following image.
We decided to start debugging deeper, and we found out the error was:
Which makes reference to the function cleanupDeps() from the vue watcher.
Questions
My questions are:
- Why is this happening only on production and not development (talking about nuxtjs environments and webpack compilation)
- Is there anyone else who faced this in the past? (I've been researching in Github issues and internet in general and haven't found nothing, that's why I'm posting this question here.)
Thank you very much in advance if someone manages to solve this.
Update on issue found
After some more investigation after I posted the question, I found out that the error was being provoked by Vuetify tabs, the why, we still don't know but this is a detail that scopes the question a little bit more.
vue.js vuejs2 vuex vuetify.js nuxt.js
vue.js vuejs2 vuex vuetify.js nuxt.js
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
edited Nov 22 '18 at 9:57
bretanac93
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
asked Nov 21 '18 at 16:18
bretanac93bretanac93
517515
517515
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45
add a comment |
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53416331%2fvuejs-watcher-out-of-memory-crash%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53416331%2fvuejs-watcher-out-of-memory-crash%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Please show the relevant code
– thanksd
Nov 21 '18 at 16:27
we are not able to identify where is it exactly because is coming from VueJS itself, the error is coming from here: github.com/vuejs/vue/blob/…
– bretanac93
Nov 21 '18 at 16:30
Are you able to test it in another browser? Just to see if it's Chrome specific or not.
– SnakeyHips
Nov 22 '18 at 12:06
Nope, I tested in all 3 (Chrome, Firefox and Safari), and even in Edge and doesn't work, gets frozen and eventually shows the error that the tab is dead.
– bretanac93
Nov 22 '18 at 13:30
Could be related to this or this?
– SnakeyHips
Nov 22 '18 at 15:45