Next.js Discord

Discord Forum

Client Side Rendering?

Answered
Azure Gallinule posted this in #help-forum
Open in Discord
Azure GallinuleOP
Hello! - I have recently used NextJS with Graphic Walker (an alternative for Tableau visualizations) and after numerous hours I ended up concluding that the default CSR in NextJS does not seem to work as in theory. Graphic Walker needs browser global variable: window.document to render its components but when the application loads, the next error is triggered: ReferenceError: document is not defined - it seems like somehow NextJS is first trying to build components in the server even when no specifying getServerSideProps neither getStaticProps. Any thoughts? - Any workarounds?
Answered by Giant panda
Client components are still prerendered server-side to ensure SEO. If you have 3rd party libraries that are incompatible with this you need to use next/dynamic and import them with the ssr flag set to false which enforces them to become truly client-side only.
View full answer

5 Replies

Giant panda
Client components are still prerendered server-side to ensure SEO. If you have 3rd party libraries that are incompatible with this you need to use next/dynamic and import them with the ssr flag set to false which enforces them to become truly client-side only.
Answer
Azure GallinuleOP
Thank you @Giant panda
@Giant panda Client components are still prerendered server-side to ensure SEO. If you have 3rd party libraries that are incompatible with this you need to use `next/dynamic` and import them with the `ssr` flag set to `false` which enforces them to become truly client-side only.
Polish Greyhound
Where can I get knowledge about Client components are still prerendered server-side to ensure SEO.. Is it documented explicitly in the Next.js official? I got misconception that the Client components are rendered only on client-side.
Giant panda
There is nothing specifically to learn about that. It's just a fact. There isn't more to it.