Requirements

I had a special case come up where I needed to build a site that:

• Only had static HTML
• Didn’t have any JavaScript whatsoever

Weapon of Choice

React still was an attractive option due to its composability and the widespread availability of libraries. Other JS libraries (Vue | Angular | Svelte) might work as well, but I am not familiar with their SSR capabilities.

Being familiar with GatsbyJS, it’s out-of-the-box SSR feature seemed like a good fit for the requirements. Alas, although there are plugins like gatsby-plugin-no-javascript, an issue that I ran into was I couldn’t remove all JavaScript without the build breaking somewhere. Specifically, a polyfill.js was giving me some difficulty. I could have created a custom plugin, but the dependency overhead was too high given that the requirements were so basic and the majority of GatsbyJS features would not be used.

I took a step back and tried to find the simplest method that would yield the results I was looking for. I knew that I wanted to keep React, so the simplest approach would be to use ReactDOMServer.renderToStaticMarkup.

#server-side-rendering #styled-components #javascript #react #nodejs