nuxt: nuxt memory leak

Version

v2.12.2

Reproduction link

https://github.com/nnvgm/report-nuxt-memory-leak

Steps to reproduce

  1. npx create-nuxt-app with typescript
  2. docker-compose up -d
  3. docker stats to display memory container is being used
  4. use apache benchmark request to nuxt app with command ab -n 500 -c 5 -t 30 "http://localhost:3000/"

What is expected ?

memory is free

What is actually happening?

after request memory is not free.

<div align="right">This bug report is available on Nuxt community (#c10697)</div>

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 5
  • Comments: 17 (5 by maintainers)

Most upvoted comments

Memory leaks in dev mode are unavoidable as far as I know. ~Closing here~ as no memory leak is present in the prod build.

The OP’s repo hasn’t been checked yet.

May I know why memory leaks are unavoidable ?

We are not talking about a few KB of leaks but 5MB to 20MB per request depending of your app weight.

Our stack, including a health check that requested our app every 5 seconds, ended up crashing every 2 - 3 hours in dev mode which is really annoying and not a good development experience at all!

The only solution we found was to disable the health check (not optimal) and running the app under a pm2 to ensure it’s reboot in case of crashes.

It’s probably irrelevant here, but the Nuxt hook destroyed which is a good place to unregister events or timeout is called only in client side.

So if if you add an event listener on created hook in SSR and remove it on destroyed hook (CSR only) your server app will keep in memory all listener and you’ll have a memory leak.

This use case is a real memory leak and our responsibility as Nuxt users. But the one described by OP is inherent to the Nuxt package and we can’t avoid it.

Thanks @klausXR. In my tests, the OP repro didn’t have a memory leak in production mode; it was garbage-collected correctly. Note that memory increasing under load does not mean there is a memory leak. The question is whether that memory can be reclaimed when it is no longer in use.

For my part I always have the issue in Development mode only, never in production.

Edit: The problem seems to have been fixed! https://github.com/nuxt/nuxt.js/issues/8522 https://github.com/nuxt/nuxt.js/pull/8523


Ps: for those who have a memory leak problem in production, this could help you (or not): At a time Ithought I had the problem in production too but it appeared I registered events SSR side and never free them since destroyed is never call in SSR which had the same effect that this thread

Same problem, I tried a lots of benchmark to see where it come from and here as the results I got:

ℹ Memory usage: 155 MB (RSS: 235 MB)
ℹ Listening on: http://localhost:3000/
[12:00:35] Memory usage: 152 MB (RSS: 228 MB) - total heap: 194 MB - external: 4 MB
[12:00:45] Memory usage: 156 MB (RSS: 229 MB) - total heap: 195 MB - external: 4 MB
[12:00:55] Memory usage: 165 MB (RSS: 232 MB) - total heap: 198 MB - external: 4 MB
[12:01:05] Memory usage: 128 MB (RSS: 177 MB) - total heap: 145 MB - external: 4 MB
[12:01:15] Memory usage: 134 MB (RSS: 184 MB) - total heap: 152 MB - external: 4 MB
[12:01:25] Memory usage: 134 MB (RSS: 187 MB) - total heap: 154 MB - external: 4 MB
[12:01:35] Memory usage: 142 MB (RSS: 194 MB) - total heap: 165 MB - external: 4 MB
[12:01:45] Memory usage: 147 MB (RSS: 203 MB) - total heap: 169 MB - external: 4 MB
[12:01:55] Memory usage: 146 MB (RSS: 193 MB) - total heap: 161 MB - external: 4 MB
[12:02:05] Memory usage: 151 MB (RSS: 201 MB) - total heap: 172 MB - external: 4 MB
[12:02:15] Memory usage: 156 MB (RSS: 206 MB) - total heap: 179 MB - external: 4 MB
[12:02:25] Memory usage: 158 MB (RSS: 213 MB) - total heap: 182 MB - external: 4 MB
[12:02:35] Memory usage: 164 MB (RSS: 219 MB) - total heap: 186 MB - external: 4 MB
[12:02:45] Memory usage: 171 MB (RSS: 224 MB) - total heap: 199 MB - external: 4 MB
[12:02:55] Memory usage: 169 MB (RSS: 227 MB) - total heap: 209 MB - external: 4 MB
[12:03:05] Memory usage: 173 MB (RSS: 225 MB) - total heap: 191 MB - external: 4 MB
[12:03:15] Memory usage: 178 MB (RSS: 231 MB) - total heap: 199 MB - external: 4 MB
[12:03:25] Memory usage: 182 MB (RSS: 237 MB) - total heap: 201 MB - external: 4 MB
[12:03:35] Memory usage: 190 MB (RSS: 243 MB) - total heap: 214 MB - external: 4 MB
[12:03:45] Memory usage: 189 MB (RSS: 249 MB) - total heap: 218 MB - external: 4 MB
[12:03:55] Memory usage: 196 MB (RSS: 251 MB) - total heap: 218 MB - external: 4 MB
[12:04:05] Memory usage: 200 MB (RSS: 259 MB) - total heap: 228 MB - external: 4 MB
[12:04:15] Memory usage: 201 MB (RSS: 267 MB) - total heap: 243 MB - external: 4 MB
[12:04:25] Memory usage: 206 MB (RSS: 263 MB) - total heap: 233 MB - external: 4 MB
[12:04:35] Memory usage: 211 MB (RSS: 271 MB) - total heap: 237 MB - external: 4 MB
[12:04:45] Memory usage: 216 MB (RSS: 279 MB) - total heap: 248 MB - external: 4 MB
[12:04:55] Memory usage: 223 MB (RSS: 286 MB) - total heap: 252 MB - external: 4 MB
[12:05:05] Memory usage: 226 MB (RSS: 290 MB) - total heap: 269 MB - external: 4 MB
[12:05:15] Memory usage: 235 MB (RSS: 299 MB) - total heap: 272 MB - external: 4 MB
[12:05:25] Memory usage: 237 MB (RSS: 308 MB) - total heap: 276 MB - external: 4 MB
[12:05:35] Memory usage: 241 MB (RSS: 316 MB) - total heap: 282 MB - external: 4 MB
[12:05:45] Memory usage: 238 MB (RSS: 322 MB) - total heap: 298 MB - external: 4 MB
[12:05:55] Memory usage: 243 MB (RSS: 307 MB) - total heap: 275 MB - external: 4 MB
[12:06:05] Memory usage: 248 MB (RSS: 314 MB) - total heap: 287 MB - external: 4 MB
[12:06:15] Memory usage: 254 MB (RSS: 322 MB) - total heap: 290 MB - external: 4 MB
[12:06:25] Memory usage: 260 MB (RSS: 328 MB) - total heap: 294 MB - external: 4 MB
[12:06:35] Memory usage: 261 MB (RSS: 333 MB) - total heap: 311 MB - external: 4 MB
[12:06:45] Memory usage: 271 MB (RSS: 341 MB) - total heap: 314 MB - external: 4 MB
[12:06:55] Memory usage: 273 MB (RSS: 350 MB) - total heap: 318 MB - external: 4 MB
[12:07:05] Memory usage: 274 MB (RSS: 345 MB) - total heap: 325 MB - external: 4 MB
[12:07:15] Memory usage: 284 MB (RSS: 355 MB) - total heap: 327 MB - external: 4 MB
[12:07:25] Memory usage: 287 MB (RSS: 363 MB) - total heap: 331 MB - external: 4 MB
[12:07:35] Memory usage: 284 MB (RSS: 373 MB) - total heap: 349 MB - external: 4 MB
[12:07:45] Memory usage: 287 MB (RSS: 358 MB) - total heap: 324 MB - external: 4 MB
[12:07:55] Memory usage: 293 MB (RSS: 365 MB) - total heap: 332 MB - external: 4 MB
[12:08:05] Memory usage: 298 MB (RSS: 372 MB) - total heap: 346 MB - external: 4 MB
[12:08:15] Memory usage: 303 MB (RSS: 380 MB) - total heap: 350 MB - external: 4 MB
[12:08:25] Memory usage: 308 MB (RSS: 389 MB) - total heap: 355 MB - external: 4 MB
[12:08:35] Memory usage: 309 MB (RSS: 394 MB) - total heap: 376 MB - external: 4 MB
[12:08:45] Memory usage: 317 MB (RSS: 397 MB) - total heap: 379 MB - external: 4 MB
[12:08:55] Memory usage: 327 MB (RSS: 407 MB) - total heap: 382 MB - external: 4 MB
[12:09:05] Memory usage: 326 MB (RSS: 415 MB) - total heap: 386 MB - external: 4 MB
[12:09:15] Memory usage: 328 MB (RSS: 428 MB) - total heap: 393 MB - external: 4 MB  

How I did the benchmark

I chose to send one request per second and to print memory usage each 10 seconds using this code at the beginning of nuxt.config.js file:

setInterval(() => {
  const { heapUsed: used, rss, heapTotal: tot, external: ext } = process.memoryUsage()
  const f = (value: number) => (!value ? '-' : `${Math.round(value / 1048576)} MB`)

  console.log(
    `[${new Date().toTimeString().substr(0, 8)}] Memory usage: ${f(used)} (RSS: ${f(rss)}) - total heap: ${f(
      tot
    )} - external: ${f(ext)}`
  )
}, 10000)

Even with the lightest application I see a memory leak (javascript, npm and no other deps)

I tried with Nuxt version 2.0.0 and also with version 2.12.2

I launched this bash command to run requests in a queue with 1 second delay between each (you could use ab instead):

while :; do; curl http://localhost:3000/ > /dev/null; sleep 1; done

More info

With bigger applications the memory goes full very quickly! I have an app which take roughly 600MB at startup and crash in 3-5 minutes when receiving a request per second (and with targeting only an 404 error layout, so no component loaded).

Just clone the repository from the OP, run npm install, then npm run dev and simulate some traffic to it anyway you want, what I used was ab -n 1000 http://localhost:3000 ( using the ApacheBench tool ), and this is the result:

[10:22:01] Memory usage: 156 MB (RSS: 233 MB) - total heap: 192 MB - external: 6 MB                                                                                                           10:22:01  
[10:22:11] Memory usage: 156 MB (RSS: 233 MB) - total heap: 192 MB - external: 6 MB                                                                                                           10:22:11  
[10:22:21] Memory usage: 135 MB (RSS: 182 MB) - total heap: 142 MB - external: 6 MB                                                                                                           10:22:21  
[10:22:31] Memory usage: 135 MB (RSS: 182 MB) - total heap: 142 MB - external: 6 MB                                                                                                           10:22:31  
[10:22:41] Memory usage: 135 MB (RSS: 182 MB) - total heap: 142 MB - external: 6 MB                                                                                                           10:22:41  
[10:22:51] Memory usage: 200 MB (RSS: 268 MB) - total heap: 225 MB - external: 6 MB                                                                                                           10:22:51  
[10:23:01] Memory usage: 573 MB (RSS: 644 MB) - total heap: 593 MB - external: 6 MB                                                                                                           10:23:01  
[10:23:11] Memory usage: 573 MB (RSS: 644 MB) - total heap: 593 MB - external: 6 MB                                                                                                           10:23:11  
[10:23:21] Memory usage: 573 MB (RSS: 644 MB) - total heap: 593 MB - external: 6 MB                                                                                                           10:23:21  
[10:23:31] Memory usage: 736 MB (RSS: 845 MB) - total heap: 785 MB - external: 6 MB                                                                                                           10:23:31  
[10:23:41] Memory usage: 946 MB (RSS: 1040 MB) - total heap: 977 MB - external: 6 MB                                                                                                          10:23:41  
[10:23:51] Memory usage: 1110 MB (RSS: 1208 MB) - total heap: 1141 MB - external: 6 MB                                                                                                        10:23:51  
[10:24:01] Memory usage: 1254 MB (RSS: 1358 MB) - total heap: 1287 MB - external: 6 MB                                                                                                        10:24:01  
[10:24:11] Memory usage: 1251 MB (RSS: 1464 MB) - total heap: 1386 MB - external: 6 MB                                                                                                        10:24:11  
[10:24:22] Memory usage: 1381 MB (RSS: 1541 MB) - total heap: 1462 MB - external: 6 MB                                                                                                        10:24:22  
[10:24:32] Memory usage: 1493 MB (RSS: 1635 MB) - total heap: 1555 MB - external: 6 MB                                                                                                        10:24:32  
[10:24:42] Memory usage: 1605 MB (RSS: 1734 MB) - total heap: 1651 MB - external: 6 MB                                                                                                        10:24:42  
[10:24:52] Memory usage: 1626 MB (RSS: 1792 MB) - total heap: 1704 MB - external: 6 MB                                                                                                        10:24:52  
[10:25:02] Memory usage: 1721 MB (RSS: 1874 MB) - total heap: 1785 MB - external: 6 MB                                                                                                        10:25:02  
[10:25:12] Memory usage: 1724 MB (RSS: 1879 MB) - total heap: 1791 MB - external: 6 MB                                                                                                        10:25:12  
[10:25:22] Memory usage: 1724 MB (RSS: 1879 MB) - total heap: 1791 MB - external: 6 MB                                                                                                        10:25:22  
[10:25:32] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:25:32  
[10:25:42] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:25:42  
[10:25:52] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:25:52  
[10:26:02] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:02  
[10:26:12] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:12
[10:26:22] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:22
[10:26:32] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:32
[10:26:42] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:42
[10:26:52] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:26:52
[10:27:02] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:02
[10:27:12] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:12
[10:27:22] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:22
[10:27:32] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:32
[10:27:42] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:42
[10:27:52] Memory usage: 1684 MB (RSS: 1847 MB) - total heap: 1749 MB - external: 6 MB                                                                                                        10:27:52
[10:28:02] Memory usage: 1685 MB (RSS: 1848 MB) - total heap: 1749 MB - external: 6 MB   

If you don’t want to do the logging technique, you can hook up the chrome debugger and inspect the memory over there ( its the same thing ). The scripts that I use in my application to enable it are

"debug": "node --inspect node_modules/nuxt/bin/nuxt",
"debug:osx": "node --inspect node_modules/.bin/nuxt",

I’m running Windows 10 and the node version is v13.14.0

I also want to point out that this is in development, not in production, and is very unsatisfying to work with.

I would like to also hear why these are unavoidable, why are they so aggressive ( the memory grows very fast on larger applications, as the OP has mentioned and that is my case as well ), and why is this not mentioned somewhere in the documentation if its a known issue? There are a few paragraphs written about the flashing css issue, but I’ve never encountered anything regarding to this ( my apologies if there is ), so I, as many others, have spent a lot of hours trying to figure out whether or not the issue is with my code or the nuxt’s source code or its dependencies.