Isomorphic React vs Gatsby (Static Site) React

Question

Are there any key differences or benefits to using isomorphic (server side) react, vs using a statically generated react app with for example gatsby?

I understand, both will generate html to send to the browser for the initial page load so they both have SEO optimisation. And both can be used with authenticated routes and non-static content. I know they are not the same thing, but what are the differences and more importantly why would someone use one over the other.

Thanks in advance.

Answer 1

There are some differences.

1. As the names suggest, isomorphic rendering requires a backend server; pre-rendering does not require a backend server.
2. With SSR, the page and metadata will include user-specific data; pre-rendering will not include user-specific data on initial page load.
3. Pre-rendering requires serving multiple .html files and proxies must be redirected to those files; isomorphic rendering is still an SPA.

Under what conditions would one be favored over another?

Where user-specific data would ideally be severed when page is loaded (Iso) Where content doesn't change much and is not user specific (Pre)

The differences noted are the critical differences. There is variation of techniques within the different approaches.

Aside, Isomorphic rendering combines SSR and CSR. Isomorphic rendering does dynamic routing in the browser. SSR only solutions serve new pages at every new route.

Two good resources:

https://www.toptal.com/front-end/client-side-vs-server-side-pre-rendering

https://jamstack.org