Did you know that when you discuss SSR with your friends, it’s highly likely that your understanding of SSR differs? Let’s take a few scenarios. Which ones do you consider as SSR?
- Generating the view from the backend using PHP.
- Frontend is a React-based SPA, but if the backend detects a search engine, it switches to a different template that is specifically designed for search engines instead of the React-rendered page.
- Frontend is a React-based SPA, but it uses Prerender to render the page as HTML and then serves it to the search engine (regular users still get the SPA experience). The difference from the previous scenario is that the view seen by users and search engines is mostly the same.
- Frontend is a React-based SPA, and the backend uses
renderToString
to render React into a string, but there is no data. The data is fetched on the frontend. - Frontend is a React-based SPA, and the backend makes API calls to fetch data for each page. After fetching the data, it calls
renderToString
to output HTML. On the client-side, hydration is performed to make the page interactive.
Some people believe that any view generated by the backend is considered SSR, so all scenarios 1 to 5 are SSR. Others think that the frontend must be an SPA for it to be called SSR, so scenarios 2 to 5 are SSR. Yet, some people consider hydration as the key aspect of SSR, so only scenario 5 (or 45) is SSR.