Thought I'd include a brief description of my experience with React Server Components for other React developers who are curious but have yet to use them.
I tried to use them for MetaLounge, thinking it'd be great to prerender most of the page HTML for the app on the server and then just hydrate portions of it on launch.
If you've used / read about them at all, you'll know that a component can only be rendered server-side if it doesn't use hooks like useState and useEffect. If you want to use those hooks (or a number of other React features) you have to mark your component as a client-side component by placing "use client" at the top of the file.
No worries, I thought. I'll just put the overall structure (trunk) of the site into server components, and I'll use client components for the leaf components.
With that goal in mind, I even stripped out the beautiful Chakra UI components that I had been using to build the UI (since they require "use client") and replaced them with a Bootstrap CSS-only approach so I could fully make use of server components.
In the end, it hasn't really worked out. Pretty much every third-party library I've needed to use on this project has required me to place "use client" at the top of a component file, thus marking it and all components under it as child ones. Some of those are Providers that wrap entire major chunks of the app. So, in the end, 99% of my app is client side and I'm presumably getting nothing out of whatever pre-rendering passes happen when I compile the app and push it to Vercel.
I'm now kicking myself daily for stripping out Chakra UI (because the look of the site was really nice with that in place) and I'm left with sort of a rat's nest of Bootstrap SCSS to clean up.
If I had it to do over again I would not have tried to use Server Components on this project. They are undoubtedly awesome for rendering out mostly static sites, but they're not a great fit for this project.
I guess this is how we learn new things and progress, though - through trial and error. I'll just chalk it up as a valuable learning experience.

