posthog-js
posthog-js copied to clipboard
PostHog
RangeError: Maximum call stack size exceeded (Next.js App Dir)
Using PostHog JS (React) with a Next.js (app dir) turbopack app. The posthog.capture function (as well as other internal ones like autocapture) trigger a maximum stack depth size exceeded error.
This seems to have been a bug for a very long time but it's uncaught. Sentry's billing is absolutely in pain when that error fires endlessly. How can we debug and prevent this?
Hey @oalexdoda
copying your question from the other issue you posted it
How can we add data-turbo-eval="false" while using the Next.js / React SDK? Not sure if related but this is happening on Next.js app dir turbopack. Absolutely destroys our Sentry events billing.
There'a a chance you can't but honestly it's a question for turbopack not for posthog
Turbopack is pretty clever - but it's cleverness means that it simply won't always work with all third party libraries.
I think that the only way to use turbopack with posthog (and other libraries too) is to include the snippet and mark it data-turbo-eval="false"
My understanding of turbopack is that this is a trade-off of using it. Some things will be faster with the trade-off some things will need work arounds.
I guess that's maybe a frustrating answer but you all know turbopack better than us so if there is a solution it's way more likely to come from turbopack or the turbopack community than from us.
closing since this isn't something we can fix in PostHog (I think)
happy to hear solutions from others if we're missing a trick...
Is there a mixup here between Next.js turbopack and the Rails hotwired/turbo library? I'm not aware of any data-turbo-eval attribute that Next.js turbopack uses.
Ah, damn, sorry - pattern matching :)
in which case some public example or repro would be super helpful!
Stumbled on this too.
module.js:1 [PostHog.js] [SessionRecording] could not emit queued rrweb event. RangeError: Maximum call stack size exceeded
...
Happens after numerous route changes on Next 15@canary with app router.
Happens sporadically, when i transition between pages.
For now, i couldn't identify the reason, but it happens only after 10-15 route changes.
Not every time, but pretty reproducible.
No idea how to debug...
Not every time, but pretty reproducible.
Is it possible you could create the reproduction @neoromantic - the ecosystem is pretty large and i could end up chasing shadows 🙈
What's interesting in the error you share is the 'rrweb queueing' is only intended as a stopgap. It's there because sometimes recording takes slightly longer to start and we try to poke custom events in before its ready. So it points at some other thing causing a problem with that message as a symptom
Can report it's happening in Pages router as well, usually during a heavy rerender
hey @lukebelbina is the site public for us to test? does it happen in prod or local dev or...?
Facing the same issue on our Vue.js setup. Same stack trace as shown by @lukebelbina Currently, the issue only appears in our staging environment.
Hey @Raj1v
Is there any more information you can share?
I'd love to figure out what triggers this - even if it's outside of PostHog - but at the moment we don't have anything reproducible we can look into.
@pauldambra
Yes, the error seems to originate from the _execute_array function. In my understanding, this function sends over events triggered before Posthog got initialized.
I placed a breakpoint in the function (line 687 in screenshot), which is indeed hit many times before the call stack gets exceeded. The breakpoint on line 689 is never hit.
Oh fascinating! That code has been there since day 0 🤯
It looks like the array is a single item so my gut feel is that it's not the content of the array. Can you share your snippet?
import posthog from 'posthog-js'
export default {
install(app) {
/**
* @type {import('posthog-js').PostHog}
*/
const instance = app.config.globalProperties.$posthog = posthog.init(import.meta.env.VITE_POSTHOGKEY, {
api_host: 'XXXX', // Reverse proxy hosted on Azure Front Door
ui_host: 'https://eu.posthog.com',
capture_pageview: false,
person_profiles: 'identified_only',
})
app.provide('posthog', instance)
app.config.globalProperties.$posthog = instance;
window.posthog = instance
},
}
Using the Vue JS plugin setup from the docs.
Stopping to emit the $pageview event on route changes stops the errors.
Browser also seems to affect the issue. On Safari, the error triggers consistently on each page load. On Chome only occasionally .
@pauldambra Correct, not on production
Building for production and serving locally also triggers the error. Some $autocapture events also trigger the event, so not exclusively $pagecapture
Really a head-scratcher 🤯
Turns out it was an accidental double initialization from the JS SDK. Once through Google Tag Manager, and once through Vue.
Maybe all it needs is a throttle on the session recordings side and to check if an instance already exists before re-initializing it.
Also experiencing this issue!
posthog-js: v1.214.0
next:15.1.0
The error appears after rapid route changes caused, in our case caused by search params updating when tanstack table filters / pagination controls are updated. Setting disable_session_recording=true resolves the issue.
So can we have an answer on this issue ? I'm experiencing the exact same thing (with a simple Vite React App)
Just received Maximum call stack size exceeded in Next.js App Dir. Sentry reported over 1600 events!
I'm happy to share my stack trace:
RangeError: Maximum call stack size exceeded
at console.overrideMethod(app:///build/installHook.js:1:146977) at(./node_modules/.pnpm/@[email protected]/node_modules/@sentry/core/build/esm/utils-hoist/instrument/console.js:36:1) at t._log(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:1752) at t.warn(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:1960) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58871) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046) at Wt.addCustomEvent(app:///static/recorder.js:1:79813) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58685) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046) at Wt.addCustomEvent(app:///static/recorder.js:1:79813) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58685) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046) at Wt.addCustomEvent(app:///static/recorder.js:1:79813) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58685) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046) at Wt.addCustomEvent(app:///static/recorder.js:1:79813) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58685) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046) at Wt.addCustomEvent(app:///static/recorder.js:1:79813) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._tryRRWebMethod(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58685) at iq._tryAddCustomEvent(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:58951) at iq._pageViewFallBack(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:64033) at iq.onRRwebEmit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:61962) at this.stopRrwebemit(./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/posthog-js/dist/module.js:1:60599) at At(app:///static/recorder.js:1:74046)
Relevant Packages:
next: 15.3.0-canary.18 // Latest available version is detected (15.3.0-canary.18).
react: 19.0.0
react-dom: 19.0.0
typescript: 5.8.2
posthog-js: 1.232.3
posthog-node: 4.10.1
Would love to have a fix for this, not the error you want to run into on a friday night.
Also having issue mentioned above "[PostHog.js] [SessionRecording] could not emit queued rrweb event. RangeError: Maximum call stack size exceeded"
I appreciate people adding that they're experiencing something,,, but we don't know what the issue is and it doesn't occur for everyone
so we really need more info on your site, your posthog setup, or what is happening when it triggers for you
@pauldambra you can try our live site: https://gamescript.ai where this error regularly occurs. Hopefully inspecting the index file source you'll be able to see our calls. We are using the recommended web snippet.
Our setup is: Axum, Dioxus (wasm)
But from the browser perspective (where this script executes) it's just html/css/js/wasm.
