is every page in React should be Server-Side rendered?

Question

I use Next.js for server-side rendering in a React Website.

for now, I use server-side rendering for almost every page of the website, even profile info and other pages that need Login to access.

is it right?

if Server-side rendering is mostly for SEO and accessing meta tags easily when sharing a page on Social Media, so only pages that can be accessed without a login should use it, not every page of the Website.

Answer 1

There is no right or wrong answer here. It all depends on your use cases, user experience requirements, search engine requirements, etc.

Next.js has several types of rendering, server side rendering and browser side rendering are 2 of them. You can however choose to use an api (eg. REST or Graphql) to query additional data. For example, you pass some basic information to some components using server side rendering, and fetch the additional details from an API using browser side rendering.

EG: Show the first 3 items using server side rendering, and fetch the additional items using browser side rendering and some API. If you need user specific details, you can use sessions (which are stored on the server side) and your API can use that session information.

You can also pass in the json data to the browser (using server side render) and render the page using browser side rendering.

Answer 2

I think you are using the wrong terminology. In next.js:

By default, Next.js pre-renders every page. This means that Next.js generates HTML for each page in advance, instead of having it all done by client-side JavaScript. Pre-rendering can result in better performance and SEO.

Here is the docs

You should be asking should everything be fetched server-side or not . Then answer is no.

Some pages are critical for SEO, for example, you have an eCommerce website and you need to fetch all the items. You should be fetching data server-side and when html is sent to the client, it will be populated with the items, so search crawlers will index your website higher.

But let's say you have an admin section, and you need to fetch all the registered users. Populating your html with bunch of names is not gonna give you extra benefit for SEO. In this case you can fetch the users client-side.

Regarding meta tags, every page should have meta tags.