search

vuejs / vuepress

📝 Minimalistic Vue-powered static site generator
https://vuepress.vuejs.org
MIT License
22.58k stars 4.76k forks source link

javascript heap explodes with vuetify 2 based custom theme #1878

Open jaunt opened 5 years ago

jaunt commented 5 years ago

Bug report

After the client and server are compiled successfully, during the "Rendering static HTML" phase, the rendering of pages gets slower and slower until a crash:

Steps to reproduce

Check out the repo below. Yarn install. vuepress build docs.

https://github.com/jaunt/vuepress-vuetify2

What is expected?

The speed of each page rendering should be constant (they are duplicated md files). Memory should not run out.

What is actually happening?

Rendering gets slower and slower until javascript runs out of heap memory:

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

Other relevant information

Environment Info:

System: OS: macOS High Sierra 10.13.6 CPU: (8) x64 Intel(R) Core(TM) i7 CPU 860 @ 2.80GHz Binaries: Node: 10.16.0 - ~/.nvm/versions/node/v10.16.0/bin/node Yarn: 1.17.3 - /usr/local/bin/yarn npm: 6.10.3 - ~/.nvm/versions/node/v10.16.0/bin/npm Browsers: Chrome: 76.0.3809.132 Firefox: 69.0 Safari: 13.0 npmPackages: @vuepress/core: 1.1.0 @vuepress/theme-default: 1.1.0 vuepress: ^1.1.0 => 1.1.0 npmGlobalPackages: vuepress: Not Found

ulivz commented 5 years ago

Sorry but we would not help you solve the problem which is relative to the out-of-memory.

What we can do is to build a strategy of detecting build performance to help you to know the memory footprint for each stage.

jaunt commented 5 years ago

Hi, thank you for looking into it! Out of curiosity, do you suspect there is a bug in how I am using vuepress in the minimal example I posted above, or do you think there is a bug in Vuetify 2.0?

richardcov commented 5 years ago

Hi @jaunt, when using Vuetify 1.5, I found that trying to pre-render components would cause the error that you describe. E.g. if you have a top toolbar or footer on each page, try wrapping them in <ClientOnly> and see if that helps.

meteorlxy commented 5 years ago

Potential memory leak?

https://github.com/nuxt/nuxt.js/issues/3465

jaunt commented 5 years ago

Thanks for the tips @richardcov & @meteorlxy

meteorlxy commented 4 years ago

Maybe related to #1560

sunziping2016 commented 4 years ago

Hi @jaunt, when using Vuetify 1.5, I found that trying to pre-render components would cause the error that you describe. E.g. if you have a top toolbar or footer on each page, try wrapping them in <ClientOnly> and see if that helps.

I have encountered the same problem when using vuepress with vuetify theme. And adding <ClientOnly> to the header and drawer components successfully solve this problem. Thanks a lot.

th0r commented 1 year ago

You can try --max-concurrency option - it helped me reduce memory usage during a build from ~8G to ~3.5G.