Question: How to integrate with NextJS (server-side components)

[alexdelgado]

Hey!

It looks like you're creating a client-side context which works great in most cases, but NextJS does a lot of server-side rendering and caching so either you push <track /> really far down, or lose out on some of NextJS's caching.

Is that right?

How are you integrating the two?

[visualjeff]

Alex, Have you had any success with Nextjs 14 and this package since this creating this issue?

[alexdelgado]

Nope, we ended up building our own data layer that doesn't use react contexts. While most of the data layer does work "client side", we're still leveraging server-side rendering using the Script tag with onReady functions.

[tizmagik]

So most everything happens within a useEffect and the context should be getting re-established client-side so the server-side ends up being mostly a no-op.

We used this with a server-rendered framework at NYT, so it should work fine in an SSR mode.

What issues were you running into @alexdelgado ?

[alexdelgado]

Honestly it turned out to be a mis-understanding of how inter-leaving works in Next.js I was under the impression that if you created a client-side context then everything would become client-side. It took watching some videos to understand that's not the case.