Bryan Kielpinski

Bryan Kielpinski

Two Forms of Pre-rendering

Websites are a great way of marketing to the world. They allow people to share information like never before. But now comes the tough part, how do you want to structure and build your application?

I'm here to tell you it doesn't have to be a tough decision. In the world of web technology, there are many options for building your web app. You could build a website using a LAMP (Linux, Apache, MySQL, PHP or Perl or Python) stack and configure from scratch, or you could pick one of the many and ever growing frameworks that are out there that make many of the lower level configuration decisions for you.

I like choosing a middle ground between "completely build from scratch", like Arch Linux, and "completely boxed into a corner" with a not-so configurable framework that was designed for people who do not want to turn the knobs and configure away.

Assuming you take a middle ground and use a modern framework it is likely that you may use React or some other JavaScript based framework to get the job done. There are two forms of pre-rendering: Static Generation and Server-side Rendering. The difference is in when it generates the HTML for a page.

  • Static Generation is the pre-rendering method that generates the HTML at build time. The pre-rendered HTML is then reused on each request.
  • Server-side Rendering is the pre-rendering method that generates the HTML on each request.

This is where the decision making fun begins and we get to evaluate what your app does and how it does it. By choosing a configurable setup we get to choose which pre-rendering form to use for each page. You can create a "hybrid" app by using Static Generation for most pages and using Server-side Rendering for others.

All in all, the web is a cool place and web technology is pretty facinating! Thanks for taking a few moments to listen to me babble about the two forms of pre-rendering we can use in our applications. If you want to learn more check out this article to figure out when you may want to use one over the other!