Static Website Generators

Static Website Generators are an increasingly popular tool for web development. Many developers including myself find static site generators to be incredibly convenient and powerful tools. Let's discuss if they're right for your website.

Dynamic vs. Static Websites

Most websites with interactive or user added content (like comments or posts) have a server (with an appropriate OS), database, backend routing, plugins and more. Furthermore when there is a CMS (Content Management System: Wordpress, Drupal) involved (as it typically is for clients) then there’s CMS specific themes, plugins, and the CMS application itself. Now that is a ton of stuff.

Statically generated websites have none of that; they’re just HTML, CSS, and JavaScript files generated and hosted on a server. This confers significant advantages, while not having as much of a disadvantage in features as you may think.

Ease of Development

Static site generators are very easy to create and deploy. All I did to create my old website was fork a Github repository called Jekyll Now and edit the configuration file. Github automatically generates and deploys your Jekyll website. From that point, all you have to do is add blog posts in markdown. Obviously, if you want a custom theme, it will take some work, but getting the website itself up and running is no issue at all.

This is perfect if you, like me, don’t want to spend too much time on the design and coding of a blog or website; rather focusing on the content while working on other projects.

Lightweight

Statically generated websites are much faster than dynamic websites. Heavy duty back-ends that are present on most websites really slow everything down and add a lot of bloat to the server. Static websites eliminate almost all of that.

This way you can have a website that:

  1. Loads faster
  2. Takes less server space

Which in turn allows you to:

  1. Keep users engaged
  2. Save money on servers
  3. Be better prepared for traffic spikes

Speed is a critical measure for websites; 53% of mobile users abandon a website that takes longer than 3 seconds to load. Too many businesses, big and small, have bloated web pages that take far too long to load causing users to become bored and frustrated. If you want users to pay attention, you can’t be wasting their time loading.

You can use this calculator to see what effect your slower page speeds are having.

Why are Static Websites Faster?

Static websites improve speed and alleviate servers because they are so incredibly small causing the strain per “serve” to a user to be reduced. Also, static websites have fewer files, in general, causing it to have a faster load as well: 5000 files together taking up 1 MB of space take more time to download than one file that takes up 1 MB of space. The reason for this is because the server and your computer have to make a sort of “handshake” for every individual file slowing down the entire process. Back-end frameworks tend to have a lot of files, especially in heavyweight or slower frameworks like Ruby on Rails.

A simplified way to think about this: the reduced space in conjunction with fewer files allows the server to spend a ton fewer resources: less CPU strain because of less file processing, and less RAM usage because the file size for the concurrently running websites is smaller. For example, using a static website generator means that 1 GB of RAM can run maybe 500 of your websites vs 50 with a typical dynamic site and the CPU isn’t straining to make a billion handshakes because all it has to do is load 5-10 files instead of 50-100. So you can have 10 times the users with the same server space, and those users will receive their content much faster because the CPU on the server isn’t strained at all.

Security

CMSs are both finicky and vulnerable. Avoiding them will prevent common exploits from affecting your website. It’s been estimated that almost 70% of Wordpress websites are vulnerable to very common exploits and hacks. This isn’t a thing that is easily mitigated either: even the most powerful people in the world are vulnerable to this. This is the nature of having a visible backend or CMS; people can easily identify and exploit it. With a static website, you get around this because you don’t even have a backend to exploit.

Reliability

One of the most fundamental ideas when it comes to engineering a physical product is that less moving parts result in greater reliability; SSDs are faster and more durable than hard disk drives. This is also true for websites. Even if your website works perfectly now, over time something will go wrong. This happens whenever there is a server and complex backend involved. There is often sort of this code “rot” that happens for a myriad of unidentifiable reasons and your perfectly running website will go down if not maintained creating a large amount of technical debt. Having a statically generated website means that there are almost no “moving parts”, and the website can stay online for years without much maintenance.

Feature Parity

One of the biggest disadvantages of static websites is their lack of features and interactivity. Dynamic websites have no problem making users interact and post things on the website. This isn’t as big of a problem as you may think though.

All the major static site generators are slowly adding many of the most common features of fully fledged websites. There is a plugin that allows for comments to be posted, (or you could use a service like Disqus). When it comes to forms, Netlify has a form handler. With Algolia you can. Do you want your clients to have a nice CMS interface? There are ways of hooking up the generator with a CMS and generating a new post upon clicking submit in the CMS. You can even email in posts. Static websites are creeping closer and closer to full blown websites. The best part of using these solutions is that you aren't managing any of this in the back-end. These companies do it for you with better security and features than you would be able to come up with independently.

Version Control: GitHub

Many people use Jekyll to run their blog specifically for its integration with Github pages. Free server and domain? Automatic generation upon push? Github as version control? Sign me up.

The advantage of version control is that you can take a look at the edits you’ve made to your blog, from the grammar edits to the spellings, and even better, if someone else finds an issue, they can make a request to fix it in GitHub. It’s like your readers are working together with you on an open source project to make the best blog possible.

More than that, there are backups to all changes, so you can easily revert to an earlier stage if something goes wrong. Constantly backing up databases is a much clumsier alternative.

Conclusion

In short the biggest advantages of Static Website Generators are:

  1. Cheap and Lightweight on Servers
  2. Secure
  3. Fast
  4. Convenient to Use
  5. Version Control
  6. Near Feature Parity

I think that most businesses can move towards a static website with no real ill effects. Most major features can be outsourced to another website or plugin that handles it. Statically generated websites are good enough for heavy duty things like the Obama campaign, Github Services, the Ruby on Rails blog, the new Healthcare.gov, (and more!) and they’re convenient enough for small blogs like this one to use. I have high hopes for the future of Static Website Generators, and hope they are a vision of the future web; blazing fast.