From Static Site Generation to Serverless Pre-Rendering

Cover Image for From Static Site Generation to Serverless Pre-Rendering
Tanner Linsley
Tanner Linsley

The good, the bad, and the ugly of SSG

2 years ago I created and have since maintained a library called React Static. It's a progressive static site generator much like Gatsby, but less opinionated (and likewise, less magical). If you're interested in learning more about it, you can watch my presentation about it at JamStack Conf NY 2019.

Writing and maintaining this library has taught me many reasons why static progressive site generators are great. But has also presented so many difficulties inherent to their architecture that I didn't see before. Most of the difficulties revolve around a few core ideas:

  • Progressive static sites are difficult to scale for large amounts of pages and also highly dynamic/frequently updated content. Both of these constraints are difficult pills to swallow when you reach them in an SSG.
  • Progressive static sites have a much harder time fitting into content creator and business workflows than dynamic sites. The problems that need to be solved to make these workflows acceptable are very difficult but they are increasingly more important for companies. So much even that Gatsby, has even created dedicated products to make the process possible at all.
  • The benefits of SSG's are mostly based in speed, simplicity, security, visitor scalability and cost. As SSG's are evolving, they are becoming more complex and introducing new overhead that traditional SSG's never suffered from. Simultaneously, dynamic site technology, especially in the React world is getting faster, more secure and more scalable, thanks to things like serverless functions and smarter CDN's.

If not progressive static site generation, then what?

Over the last few months, I have been investigating serverless functions as a new tool for scalability and dynamic website generation. I was wondering how serverless functions could compliment static content and eventually found the article: Serverless Prerendering (SPR) from Next.js's blog. The concepts involved are really simple to understand and really resonated with me.

The issues that I was trying to solve with scalability and flexibility could theoretically be solved with SPR, so I dug right in. After a lot of experimentation and discussion in the community, I'm convinced for now that Next.js is the platform that comes closest to my ideals.

Next.js... Really?

Yes. First of all, I'd like to make it clear that in the world of programming, the worst thing you can do is develop emotional attachment to an implementation detail or means to an end. I originally wrote React Static and used SSG's because they solved a problem for me that other tools didn't. But things change, and tools and ideas evolve. When I am given the opportunity to open my mind and adopt a new technology for the sake of the end product and user, I can't pass it up. This is one of those circumstances.

Next.js is a highly polished product now and I have been extremely impressed with the progress the Next.js team has made towards performance, scalability, cost, etc.

So what's going to happen to React Static?

In summary, React Static will continue to live on through the great developers and companies that use it. It is to those great individuals that I am handing it off to as successors. If you are interested in owning, sponsoring, or contributing to React Static, head over and read the RFC!

This is just the beginning of a new era for me

I plan on aggressively working on Next.js and it's features for the next little while. I am still very passionate about building fast, SEO and developer friendly websites in React and have no plans of stopping on that front.

I'm very thankful!

My experience with React Static has been amazing, and even though it's just an open source project, it has felt like a career. I put my heart and soul into it for countless hours simply to help people build better sites in React. I will admit, it's been difficult to move on. I would like to thank everyone who made that possible. Namely:

Thank you all so much!

Until next time, you can always check out my: