next.js, is server side pages rendered faster?

Question

I have a page that is hidden behind auth, so SEO doesn't matter.

It includes fetching quite a lot of data. Will the page finish loading faster if I use SSR and fetch the data in getServerSideProps, or will it be a marginal difference compared to client side fetching? The page will only be accessed by mobile.

Answer 1

TLDR;

It depends on many aspects of the page, but it may run faster because it provides a better FMP score in terms of performance results. But for pages like signup/sign-in, it won't make any noticeable difference because you should keep the FMP and interaction time gap very low.

What is the main difference?

First off, I should mention the results may vary based on geographic locations, servers, and latency, but according to studies, the SSR version of applications may be faster than the CSR ones, because it will render the viewable content of pages faster for the users. But the page until it's fully loaded may not be interactable.

SSR (Server Side Rendering e.g. Next.js) vs. CSR (Client Side Rendering e.g. Create React App)

Conclusion

Based on your usage you should take a lot of consideration. So for apps/pages like personal pannels and stuff like that, the FMP and performance scores do not matter, because users should have interacted with the page and done some stuff, and it should be fully interactable when the contents are loaded, so IMHO its better to stick with CSR and make fewer efforts for making the pages SSR like. Otherwise, for other landing pages, you should make users excited and show them some stuff of your content before they recognize it won't be worth sticking with your app because it's slow.