As I dove deeper into blogs that developers built and were using I noticed a pattern: they were simple in design, fast, and the term "static site" came up often. Hearing "static site" made me think of the origins of websites with each page rendered with basic HTML and CSS and rigid, without the seamless, smooth transitions of dynamically rendered apps we've grown accustomed to in today's web ecosystem. Here's a description of each:
With static sites, what you see is what you get. There are no opportunities for user interaction other than routing to different pages. The files are displayed exactly how they are stored and they exist to display information, not to be dynamic and interact with the user and data. By default, this is a fast process because the site does not have to interact with a server. It just exists and doesn't have to use any computational power.
By definition, dynamic sites allow user interaction. They are complex applications that are meant to process an exchange between the user and the site and, often, a server and database(s).
Why use a static site over a dynamic one?
- 1. Faster. All of the data is ready to be displayed as soon as the user loads the site and it does not need to change. This is a huge benefit for search engine optimization.
- 2. More secure. Static sites are self-contained and don't have to continually open doors for communication with the server (these openings are potential places for hackers to break into the system and inject malicious code).
- 3. Simpler. Perhaps one of the biggest advantages is the simplicity of the tech used. No server and databases eliminates a lot of complexity that comes with web development, thereby improving developer experience and the ability to keep the website well-maintained and functioning properly (especially under heavy load).
- 4. Free hosting! Without a server, it's a lot easier to host for free (I use and recommend Netlify).
Of course, the JAMstack is not for every website, but the modernized version of static sites is incredibly useful in certain situations where user interaction with a complex web app is not necessary. This site is a perfect example and I will describe my experience and what I'm using in my next post.
"Static and Dynamic Websites: There's a Difference" by Pluralsight
"An Introduction to Static Site Generators" by Eduardo Bouças