Uncaught RangeError: Array buffer allocation failed

[mortmoe]

Describe the bug I'm getting a really strange bug when using react-pdf/renderer. Whenever I push a new version of my app (a service worker clears and updates the pre-cache), my users get this bug if they reload the page, but only on mobile devices (tested using safari on ios and chrome on android). In other words it seems to happen whenever a new version of index is loaded. Reload once more and it's usually fine.

index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:160 Uncaught RangeError: Array buffer allocation failed
    at new ArrayBuffer (<anonymous>)
    at wrapper (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:160:215705)
    at Object.<anonymous> (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:160:193457)
    at u (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:1:693)
    at d (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:1:769)
    at Object.<anonymous> (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:160:192426)
    at u (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:1:693)
    at d (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:1:769)
    at Object.<anonymous> (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:160:192049)
    at u (index.ede42496.js?__WB_REVISION__=d4dab5aff5090f0aac2a00d7a7720b83:1:693)

I've clicked into the files in dev-tools and done some searching in my node_modules and it seems to be a line in @react-pdf/yoga/src/build/Release/nbind.js that fails. (Searching the files in dev tools reveals the failing command is "new ArrayBuffer(TOTAL_MEMORY)" and the only place in node_modules is line 464 in that file).

Commenting out all react-pdf imports from my code solves the problem (but ofc. then pdf-generation doesn't work).

To Reproduce Probably build a simple app with a serviceworker and update version then try to reload.

Expected behavior No crash on first reload after update

Desktop (please complete the following information):

• OS: [ios, android]
• Browser [safari, chrome]
• React-pdf version [v2.1.2]

[diequinteros]

I encountered the same error on an old react app im working on, is using react-pdf/renderer 1.6.16

[schdaniel20]

I have the same issue with version "2.3.0", webpack "5.2.0".

Uncaught RangeError: Array buffer allocation failed at new ArrayBuffer () at new Uint8Array () at new UnicodeTrie

With "@react-pdf/renderer": "2.1.1" -> everything works fine in my react app...except the chrome dev-tools performance tab, it keeps crashing every time I hit the record button.

[chirag-shah-integrella]

I encountered the same issue.

[jbauer-sds]

I am experiencing this issue as well. Has anyone worked out why this is happening?

[diequinteros]

From my testing, the mobile browser dont have the 1GB of ram thats is defined in /node_module/@react-pdf/yoga/src/build/Release/nbind.js as TOTAL_MEMORY so makes the app crash, one 'fix' is changing TOTAL_MEMORY from 1073741824 to 1/4 of it.

[marsmallos]

Having the same issue when running the react app in an electron browser, but not in the normal firefox. How do I change TOTAL_MEMORY?

[diequinteros]

TOTAL_MEMORY is a variable inside nbind.js file, for me it was in the node_module directory of my project in /node_module/@react-pdf/yoga/src/build/Release/nbind.js

[thefastlanesolution]

This is making my app crash as well, has anyone found a solid fix for this?

[paulmwhite]

Any update/workarounds for this? Seems to happen consistently with Cypress e2e tests in chrome

[jeetiss]

@paulmwhite try to update to latest @react-pdf version it uses yoga that is built with emscripten and should use less memory (16MB instead of 256MB)

[paulmwhite]

@paulmwhite try to update to latest @react-pdf version it uses yoga that is built with emscripten and should use less memory (16MB instead of 256MB)

That appears to have resolved the issue for me, thanks!