Next.js Discord

Discord Forum

Posthog analytics in NextJS

Unanswered
Snowshoe posted this in #help-forum
Open in Discord
SnowshoeOP
Hey everyone, I was reading through posthogs blog article here https://posthog.com/tutorials/nextjs-app-directory-analytics about getting analytics into next app router, and I just had a question about clarifying how use client and client rendering actually works.

In it he's creating a providers.js file and inserting a context at the layout level of the app router.

I was reading this page: https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#using-third-party-packages-and-providers

Is this essentially undoing much of the RSC/server rendering of nextjs and having the initial server rendered version be.... the html tag and the rest of the app a downloaded client component?

Just trying to understand this once and for all, but the server cant provide you with a client component on first load/paint right? This would come after that?

9 Replies

client component will still render on server which mean the page will be fully SSR
SnowshoeOP
I see! So what actually defines the boundary for a client/server component, a Suspense element?
streaming with suspense will render on client
SnowshoeOP
Alright, I'm pretty sure I get it. This is all so new and weird to me still.

is the lifecycle then:
1. Render on server
2. Show server rendered version to client as first paint
3. Hydrate the server rendered version with any JS from client components
4. Stream in components with Suspense
SnowshoeOP
Ah right, seems that way.
I understand now, thanks @Ray
yep
SnowshoeOP
how i feel learning RSC's/next14
Tibetan Spaniel
By any chance did you face issues when running a production version of your code?
I'm running into
The server could not finish this Suspense boundary, likely due to an error during server rendering. Switched to client rendering.
error only on prod. When i remove both the <Suspense> tag and the pageview client component from the example given in ur link the error disappears.
My suspicion is its trying to perform SSR on a static page... Wonder if theres a work around without having to go full SSR route