Is server side rendering possible?

[fikrikarim]

Hi. Thanks for creating this monorepo.

I wonder whether server side rendering is possible here? I tried the example but couldn't get the SSR working.

[nandorojo]

The reason it doesn't work is because of the SafeAreaProvider. You can pass initialMetrics={null} to the provider if you want to enable SSR in packages/next/_app.tsx.

Note that many React Native features could break React's server hydration if you do this, since the server and client props might not match. I've discussed this a lot at the Dripsy repo.

[fikrikarim]

Hi @nandorojo. Thanks a lot for the answer. I'm new to this, so I'm still very much on the researching part, but I've been looking for an easy way to share Expo code with SSR web. Do you have any resource/place where to look at for the current best practices? Or do you think it's not worth doing shared code instead of just splitting code between RN and SSR web app because of all the hassle? I saw the example of Expo/Next.js, but I want to use ReactNavigation as the app experience is the higher priority.

I've been playing with your hook, expo-next-react-navigation, and it looks awesome! I'm looking forward on watching your talk tomorrow on Next.js conf!

[axeldelafosse]

Is there a specific reason why you want to do server-side rendering? I'm curious.

Also, here is an example using React Navigation with Next.js: #1

[fikrikarim]

Mostly SEO. Like, if we're building a forum, and we want the content to be easily indexed by Google. Any tips?

[nandorojo]

Check this out: nandorojo/dripsy#101

If you search through the issues/PRs on Dripsy, you'll find my long quest of trying to support SSR for a year and ultimately dropping it.

You can still take advantage of the SEO meta tags, as I outlined in the "SEO Recommendations" of that post.

[fikrikarim]

Got it. A year is a lot, so it seems for now that it's not worth trying to do SSR with React Native codebase. Thanks for a year of progress. It might be cool to do a write up your experiences, I'm sure there are people out there trying to do the same thing. Thanks for the pointer and reading material, I'll go through it.

[nandorojo]

Yeah I should. I use GitHub issues for that often, and I maintain a lot of RN open source libs (Dripsy, Moti, etc), so while it isn’t the best format necessarily, if you search closed issues, I have lots of content about this stuff.

In fact, I’m speaking at Next.js Conf in two days about React Native + Next.js: fernandorojo.co/conf

[fikrikarim]

Yes. Looking forward to watching that tomorrow!

[jcarraway]

@nandorojo sorry to dig up this old issue, but could you help me understand the appeal of Next.js without SSR / SSG? I know there are more features to Next than just ssr/ssg but seems like it adds a lot of overhead esp with navigation while missing out on one of the key features. Any thoughts appreciated!

[nandorojo]

I'd rank code splitting alone pretty high. Also you can still get the SSG benefits of data fetching for SEO meta tags/initial client-side render.

[jcarraway]

Okay thanks. I just wanted to make sure I wasn't missing anything. I have this repo cloned and running with Moti, Stripe, Apollo, and a few other toys and having fun so far. The navigation bit is a little tedious, but it's a small price to pay for such powerful tool.

[nandorojo]

Yeah the navigation is pretty repetitive as it is. I anticipate this not being the case once Expo gets rid of Metro. Once that’s the case, we’ll be able to use the pages folder for navigation on Native, too.

I’m also working on a library that abstracts a good amount of the navigation code from this repo.

[jcarraway]

I'll be on the lookout - really appreciate all your work in this space