Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MaxListenersExceededWarning: Possible EventEmitter memory leak detected #2825

Open
Torbraw opened this issue Jul 19, 2024 · 12 comments
Open

Comments

@Torbraw
Copy link

Torbraw commented Jul 19, 2024

Describe the bug
When trying to render multiple times the same pdf with renderToBuffer() in a loop in a Nest.js app (with express), I get the following warnings in the console. Note that all the render() methods yield the same error:

(node:41468) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 unhandledRejection listeners added to [process]. Use emitter.setMaxListeners() to increase limit
(Use 'node --trace-warnings ...' to show where the warning was created)
(node:41468) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 uncaughtException listeners added to [process]. Use emitter.setMaxListeners() to increase limit

If I add process.on('warning', e => console.warn(e.stack)); to have more infos here's the results:

MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 unhandledRejection listeners added to [process]. Use emitter.setMaxListeners() to increase limit
    at genericNodeError (node:internal/errors:984:15)
    at wrappedFn (node:internal/errors:538:14)
    at _addListener (node:events:593:17)
    at process.addListener (node:events:611:10)
    at loadAssembly (C:\Workspace\flexyb-pay\node_modules\yoga-layout\binaries\wasm-async-node.js:11:63)
    at Object.loadYoga (C:\Workspace\flexyb-pay\node_modules\yoga-layout\src\entrypoint\wasm-async-node.ts:25:29)
    at _callee$ (C:\Workspace\flexyb-pay\node_modules\@react-pdf\layout\lib\index.cjs:698:34)
    at tryCatch (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:45:16)
    at Generator.<anonymous> (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:133:17)
    at Generator.next (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:74:21)
    at asyncGeneratorStep (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:3:17)
    at _next (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:17:9)
    at C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:22:7
    at new Promise (<anonymous>)
    at C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:14:12
    at loadYoga (C:\Workspace\flexyb-pay\node_modules\@react-pdf\layout\lib\index.cjs:718:17)
MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 uncaughtException listeners added to [process]. Use emitter.setMaxListeners() to increase limit
    at genericNodeError (node:internal/errors:984:15)
    at wrappedFn (node:internal/errors:538:14)
    at _addListener (node:events:593:17)
    at process.addListener (node:events:611:10)
    at loadAssembly (C:\Workspace\flexyb-pay\node_modules\yoga-layout\binaries\wasm-async-node.js:11:9)
    at Object.loadYoga (C:\Workspace\flexyb-pay\node_modules\yoga-layout\src\entrypoint\wasm-async-node.ts:25:29)
    at _callee$ (C:\Workspace\flexyb-pay\node_modules\@react-pdf\layout\lib\index.cjs:698:34)
    at tryCatch (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:45:16)
    at Generator.<anonymous> (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:133:17)
    at Generator.next (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:74:21)
    at asyncGeneratorStep (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:3:17)
    at _next (C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:17:9)
    at C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:22:7
    at new Promise (<anonymous>)
    at C:\Workspace\flexyb-pay\node_modules\@babel\runtime\helpers\asyncToGenerator.js:14:12
    at loadYoga (C:\Workspace\flexyb-pay\node_modules\@react-pdf\layout\lib\index.cjs:718:17)

To Reproduce
Steps to reproduce the behavior including code snippet (if applies):

  1. Clone the following repository
  2. Run npm i & npm run start:dev
  3. Go to localhost:3000/api to see the swagger-ui
  4. Call the get endpoint and see the warnings in the console of your IDE

Expected behavior
The eventEmitters should be disposed/close correctly and there should be no warnings.

Desktop (please complete the following information):

  • OS: Windows
  • Browser: None (Node.js)
  • "@react-pdf/renderer": "^3.4.4"
@PatricioNG
Copy link

Can confirm I've run into the same and went looking to see if I was the only one, seems like a potential memory leak 👀 On ^3.4.4 running on Node/Windows server 2019 on this end.

@leiteszeke
Copy link

leiteszeke commented Jul 30, 2024

Exactly the same issue. I have been receiving this in the last 3 months at least.

I am using "@react-pdf/renderer": "^3.4.4"

(node:98733) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 uncaughtException listeners added to [process]. Use emitter.setMaxListeners() to increase limit
    at _addListener (node:events:591:17)
    at process.addListener (node:events:609:10)
    at /var/www/daruma/graphql/node_modules/yoga-layout/binaries/wasm-async-node.js:11:9
    at Object.loadYoga (/var/www/daruma/graphql/node_modules/yoga-layout/src/entrypoint/wasm-async-node.js:35:43)
    at _callee$ (/var/www/daruma/graphql/node_modules/@react-pdf/layout/lib/index.cjs:707:34)
    at tryCatch (/var/www/daruma/graphql/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:44:17)
    at Generator.<anonymous> (/var/www/daruma/graphql/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:125:22)
    at Generator.next (/var/www/daruma/graphql/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:69:21)
    at asyncGeneratorStep (/var/www/daruma/graphql/node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:24)
    at _next (/var/www/daruma/graphql/node_modules/@babel/runtime/helpers/asyncToGenerator.js:22:9)
    at /var/www/daruma/graphql/node_modules/@babel/runtime/helpers/asyncToGenerator.js:27:7
    at new Promise (<anonymous>)
    at /var/www/daruma/graphql/node_modules/@babel/runtime/helpers/asyncToGenerator.js:19:12
    at loadYoga (/var/www/daruma/graphql/node_modules/@react-pdf/layout/lib/index.cjs:727:17)
    at _callee$ (/var/www/daruma/graphql/node_modules/@react-pdf/layout/lib/index.cjs:738:18)
    ```

@karlandindrakryggen
Copy link

karlandindrakryggen commented Aug 6, 2024

I've noticed the same issue. I'm not sure, but suspect that it can have been introduced in the switch from @react-pdf/yoga to yoga-layout. At least I get the dependency chains below when making a fresh installation with the different versions, and it's only with @react-pdf/[email protected] (the latest version with @react-pdf/yoga) that work without the memory issue in my tests.

One clue might be that the yoga-layout readme says that you must call config.free()/node.free()?

2.1.1

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── @react-pdf/[email protected]

2.1.2

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

latest (3.4.4)

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

Update: I've created a simple example that generates 1000 pdf documents and prints memory usage: https://github.com/karlandindrakryggen/react-pdf-memory-issue. I've included printouts for different versions of @react-pdf/renderer in the README.

@michalprikryl
Copy link

We have the same issue at the nodejs (express) environment.

(node:21532) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 uncaughtException listeners added to [process]. Use emitter.setMaxListeners() to increase limit at _addListener (node:events:588:17) at process.addListener (node:events:606:10) at C:\node_modules\yoga-layout\binaries\wasm-async-node.js:11:9 at Module.loadYoga (C:\node_modules\yoga-layout\src\entrypoint\wasm-async-node.js:35:43) at _callee$ (file:///C:/node_modules/@react-pdf/layout/lib/index.js:672:23) at tryCatch (C:\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:45:16) at Generator.<anonymous> (C:\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:133:17) at Generator.next (C:\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:74:21) at asyncGeneratorStep (C:\node_modules\@babel\runtime\helpers\asyncToGenerator.js:3:17)

@vipuljbhikadiya
Copy link

I've noticed the same issue. I'm not sure, but suspect that it can have been introduced in the switch from @react-pdf/yoga to yoga-layout. At least I get the dependency chains below when making a fresh installation with the different versions, and it's only with @react-pdf/[email protected] (the latest version with @react-pdf/yoga) that work without the memory issue in my tests.

One clue might be that the yoga-layout readme says that you must call config.free()/node.free()?

2.1.1

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── @react-pdf/[email protected]

2.1.2

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

latest (3.4.4)

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

Update: I've created a simple example that generates 1000 pdf documents and prints memory usage: https://github.com/karlandindrakryggen/react-pdf-memory-issue. I've included printouts for different versions of @react-pdf/renderer in the README.

HI are you able to trace anything we are facing same issue when we are generating PDF more then 2000 pages.

@karlandindrakryggen
Copy link

I've noticed the same issue. I'm not sure, but suspect that it can have been introduced in the switch from @react-pdf/yoga to yoga-layout. At least I get the dependency chains below when making a fresh installation with the different versions, and it's only with @react-pdf/[email protected] (the latest version with @react-pdf/yoga) that work without the memory issue in my tests.
One clue might be that the yoga-layout readme says that you must call config.free()/node.free()?
2.1.1

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── @react-pdf/[email protected]

2.1.2

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

latest (3.4.4)

└─┬ @react-pdf/[email protected]
  └─┬ @react-pdf/[email protected]
    └── [email protected]

Update: I've created a simple example that generates 1000 pdf documents and prints memory usage: https://github.com/karlandindrakryggen/react-pdf-memory-issue. I've included printouts for different versions of @react-pdf/renderer in the README.

HI are you able to trace anything we are facing same issue when we are generating PDF more then 2000 pages.

Hi! No, unfortunately I have not looked into this anymore.

@AminArjiEpitech
Copy link

Same issue here, i'll just dump my node trace and comment so i can get an update when there's one

(node:20944) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 uncaughtException listeners added to [process]. Use emitter.setMaxListeners() to increase limit
    at _addListener (node:events:587:17)
    at process.addListener (node:events:605:10)
    at loadAssembly (C:\Users\Amin\Code\Deepsy-pdf\node_modules\yoga-layout\binaries\wasm-async-node.js:11:9)
    at Object.loadYoga (C:\Users\Amin\Code\Deepsy-pdf\node_modules\yoga-layout\src\entrypoint\wasm-async-node.ts:25:29)
    at _callee$ (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@react-pdf\layout\lib\index.cjs:707:34)
    at tryCatch (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:45:16)
    at Generator.<anonymous> (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:133:17)
    at Generator.next (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@babel\runtime\helpers\regeneratorRuntime.js:74:21)
    at asyncGeneratorStep (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@babel\runtime\helpers\asyncToGenerator.js:3:17)
    at _next (C:\Users\Amin\Code\Deepsy-pdf\node_modules\@babel\runtime\helpers\asyncToGenerator.js:17:9)
    ```
    
    

@MarcoRodasW
Copy link

Hi, is there a solution for this issue? Any workaround?

@AminArjiEpitech
Copy link

AminArjiEpitech commented Sep 13, 2024

Edit : I just tested, this still causes memory leaks, please ignore.

Not a solution but a temporary workaround until this is resolved, you might not like it.

  1. Create a folder where you wish and save every rendered pdf's in there.
  2. Periodically clean the folder's content with conditions, in my case after every request i check the size of the folder and delete the oldest file, or simply delete every file older than an hour.

Here's the code i've used in a nodejs server :

const pdfFolder = path.join(__dirname, 'generatedPdfs');

if (!fs.existsSync(pdfFolder)) {
    fs.mkdirSync(pdfFolder);
}

// Clean folder on process startup
const cleanUpFolder = () => {
    fs.readdir(pdfFolder, (err, files) => {
        if (err) return console.error("Error reading directory:", err);
        files.forEach(file => fs.unlinkSync(path.join(pdfFolder, file)));
    });
};

cleanUpFolder();

...

// Call this to clean conditionnaly
const deleteOldFiles = () => {
    fs.readdir(pdfFolder, (err, files) => {
        if (err) return console.error("Error reading directory:", err);

        const fileStats = files.map(file => {
            const filePath = path.join(pdfFolder, file);
            return { file, time: fs.statSync(filePath).mtime };
        });

        const oneHourAgo = new Date(Date.now() - 3600000);
        fileStats.forEach(({ file, time }) => {
            if (time < oneHourAgo) {
                fs.unlinkSync(path.join(pdfFolder, file));
            }
        });

        if (fileStats.length > 20) {
            fileStats.sort((a, b) => a.time - b.time); // TODO: Try
            fileStats.slice(0, fileStats.length - 20).forEach(({ file }) => {
                fs.unlinkSync(path.join(pdfFolder, file));
            });
        }
    });
};

Also i suggest checking the filename before generating the pdf, in case you've already generated one you can directly send it.

@AminArjiEpitech
Copy link

AminArjiEpitech commented Sep 13, 2024

@jhgeluk Nevermind, looks like this is not a workaround at all !

I just did some tests in my previous code, and i still get the exact same warning, only instead of 11 emitters, it's now 15.
(node:133390) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 16 uncaughtException listeners added to [process]. MaxListeners is 15. Use emitter.setMaxListeners() to increase limit

I used both ReactPDF.render() and renderToFile() to test this, and i still get the warning.

Looks like the only solution to really workaround this is to do what i've done, using babel and transforming your normal react code into a script.
This would eliminate all possibility of a memory leak, but the problem with this solution is that it is more cpu and ram expensive and may not be adapted to all, it works for me because i will most likely never have more than 1-2 renders per minute.

@nnaku
Copy link
Contributor

nnaku commented Sep 17, 2024

It seems that loading yoga-layout wasm binaries for each pdf is causing event emitter memory leak warning.

@AminArjiEpitech
Copy link

#@AminArjiEpitech do you have some more details about how you fixed it? Would really appreciate it! We're fine if it's a bit more expensive on the ram/cpu. As long as it doesnt keep accumulating ram, which will result in a crash.

@jhgeluk Sorry for the late reply, so basically i run my main server, and i have a folder with the script inside of it.
Each time i receive a request to generate a pdf i basically just run a script (on linux a .sh), and put the necessary data in the argv as a json string that i then JSON.parse inside the script file and use as normal data.

And to not transform my React.jsx code into .js, i use this script here :

npx babel pdfFile.jsx --out-file pdfFile.js

You'll just need to isntall : npm install --save-dev @babel/node

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants