RFC: Server-side rendering for static pages

I believe it should be possible to make NUSMods SSR without too much pain. The main benefit of this is that the static like FAQ and semi-static pages like the module/venue pages should load much faster, and SEO on those pages will also be much better. The additional server load will be mitigated by adding a caching layer in front of the renderer.

The key steps are to making SSR work are (reference: https://medium.freecodecamp.org/demystifying-reacts-server-side-render-de335d408fe4)

• Cordon off components that cannot be server-side rendered using a HoC which only renders them on componentDidMount. Sample code: https://gist.github.com/fdecampredon/037522907cc79183feef83595b9892ae
• Create server that renders <AppShell> with a server side version of the Redux store and React router. This is relatively simple - the code used in the article above is actually pretty close to what we might do.
• Add server side code to fulfill the data requirements of the components.
• Update the nginx config as well as the local dev server to serve HTML from this server instead. We'll probably whitelist specific routes to begin with as we make the site SSR compatible bit by bit
• Add in caching as well as some sort of cache busting mechanism for when the scraper is updated as well as on deploy

Open questions

• The example ships the entire Redux state over, which would mean loading up ~300-500kb of JSON in the HTML - not entirely sure that's a good idea.
• Server side data fetching is messy - the article just put the code inside the component, but that would mean the server side code will also get bundled with the rest of the component and shipped to the client. This is not ideal because it bloats up the component and also makes separation of concerns harder.
• The above would be easier if we have a proper data layer. Maybe GraphQL would make this easier since we can just query the GraphQL server from the web server

Start by reviewing the AppShell, Redux store, React router, nginx configuration, and local development server mentioned in the RFC. Then investigate how the listed static and semi-static routes could be rendered and how server-side data fetching and caching would fit. Done would require an agreed SSR design, route scope, data strategy, and deployment/cache behavior.