Possible memory leak in Nuxt 3.20?
We recently released a new production version of our app using Nuxt 3.20. There were only a few minor changes. The app immediately started crashing due to a memory overflow error. After downgrading to 3.19.3, it started working again.
The server restarts approximately every 20 minutes.
I tested this multiple times to see if the issue was indeed related to a dependency, and it appears to be the case. I even tried to override the Vue version to 3.15.3, as there was a known issue with 3.15.22.
Does anyone know what the issue could be or how to debug this? This is uncharted territory for me.
I hope you appreciate my professional diagram, it took me a long time to make :usefetchwrong: .
[Link: https://github.com/nuxt/nuxt/issues/32240]
5 Replies
Hi @Daniel Slama. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
There is evidence in the knowledge sources that memory leaks have been reported in recent Nuxt 3 versions, particularly around the use of data fetching composables like useFetch and useAsyncData. Several users experienced memory growth and crashes after upgrading from Nuxt 3.19.x to 3.20.x, which was resolved by downgrading back to 3.19.x. This issue is discussed in detail in this GitHub issue.
Key points from the sources:
- Users observed that each request seemed to create new fetch instances and data objects, leading to increased memory usage under load.
- The problem was not present in Nuxt 3.17 or 3.19, but appeared after upgrading to 3.20.
- One workaround that helped some users was pinning the Vue version to 3.5.13, as newer Vue versions (e.g., 3.5.20) seemed to exacerbate the leak.
- There have been related fixes and discussions in Nuxt's repository, such as reinitializing stale async data to prevent memory leaks from lingering fetcher functions and data (PR #31940).
- Nuxt has introduced and improved automatic cache purging for async data and static data to help prevent memory leaks, but this is enabled by default and can be configured via the purgeCachedData experimental flag in nuxt.config.ts. If you have custom cache logic or have disabled this, it may contribute to memory issues purgeCachedData docs.
How to debug:
- Review your use of useFetch/useAsyncData and ensure you are not unintentionally creating new keys or options on each call, as this can prevent proper cache cleanup.
- Make sure you are not disabling purgeCachedData unless you have a specific reason.
- Try pinning your Vue version to 3.5.13 if you suspect the issue is related to Vue itself, as some users have found this resolves the leak.
- Monitor memory usage with and without recent Nuxt patches, and check for any open or recently closed issues in the Nuxt repository related to memory leaks.
If the problem persists, consider creating a minimal reproduction and reporting it to the Nuxt team, as described in the Nuxt bug reporting guide.
In summary, you are not alone in encountering this issue, and it appears to be a known problem with certain Nuxt and Vue versions. Pinning dependencies and keeping an eye on related Nuxt PRs and issues is recommended until a definitive fix is released. For more details and ongoing discussion, see the linked GitHub issue and comments within it.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@240907023942811648> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai it's definitely caused by the update. It worked in 3.19.3
Let me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, there is clear evidence that users have experienced memory leaks and increased memory usage after upgrading from Nuxt 3.19.x to 3.20.x. Multiple reports confirm that downgrading back to 3.19.x resolves the issue, indicating that the problem is indeed introduced in the newer version. Users specifically mention that the issue is reproducible and directly linked to the update, not to unrelated code changes or environment differences.
Additionally, some users found that pinning the Vue version to 3.5.13 (instead of a newer 3.5.x release) also mitigated the memory leak, suggesting a possible interaction between Nuxt and certain Vue versions. However, the core observation remains: the memory leak appears after upgrading to Nuxt 3.20.x and disappears when reverting to 3.19.3. This is discussed in detail in this GitHub issue.
If you are experiencing this issue, you are not alone, and the knowledge sources confirm your findings.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@240907023942811648> Kapa.ai is still learning and improving, please let me know how I did by reacting below.