As of right now, there are multiple options to choose from when it comes down to Static Site Generators. It doesn’t matter which language you prefer.
If Ruby is the language of your choice you should probably go with Jekyll4 or Middleman5 You can explore the whole list of 458 static site generators here6. More enjoyable version of the list here7.
With the sheer number of options available, choosing one will be a tough nut to crack. In this article, I’d like to go through some of the most popular options and help you make the best decision for your project.
This Static Site Generator is built on top of Ruby. The first version on Github was released in 2009, making it the oldest SSG from the top 4 that I’m describing in this article. Jekyll is also the engine behind GitHub Pages which explains why it’s the most popular option right now.
Jekyll’s popularity on GitHub over time:
The biggest advantage Jekyll has over other SSGs is it’s simplicity. You don’t have to put in a lot of effort to set up a simple blog-aware website.
It’s very simple and fast to set up and deploy your site on Github Pages as they fit well together.
👍 Huge community
This means a plethora of tutorials that’ll show you how to get started. You’ll also easily find support if you’re faced with difficulties.
👍 Liquid templating engine
If you’re coming from the most popular CMS options available on the market, such as WordPress, you should feel right at home with the Liquid templating structure.
👍 A whole lot of available open-source plugins
In most cases, you’d like to do more with your websites than just generate static files. That’s where the long list of Jekyll plugins comes in to help you.
👎 Ruby environment needed
It might be a tough nut to crack, especially for Windows users, since it’s not officially supported by Jekyll.
👎 Building time
Plugin availability can be a Con as well. As your list of plugins grows, so does your build time, meaning it will definitely slow down your building process.
Hugo’s first release came out in the second half of 2014. It’s powered by Go programming language aka. Golang8. Hugo’s general structure is very similar to the one offered by Jekyll. It’s really important to mention that Hugo is unbeatable when it comes down to building times. It turns out that Hugo can be as much as 63 times faster than Jekyll when handling big amounts of posts9!
Hugo’s popularity on GitHub over time:
👍 Incredibly fast building
Hugo is unbeatable when it comes down to building times. I personally don’t know of any Static Site Generator faster than Hugo, which makes it a great choice for big websites.
You don’t have to search and install any plugins since Hugo supports multiple content types out of the box.
Hugo has binaries for Windows, Linux, FreeBSD, NetBSD, macOS, and Android for x64, i386 and ARM architectures.
👎 Golang Syntax
Go language is definitely not the most popular programming language, so you may have some difficulties with Hugo’s syntax at the beginning.
👎 No built-in asset processing
There’s no asset pipeline built into Hugo, so you have to use external tools.Hugo 0.43 came out with Hugo Pipes, so this con is not valid anymore!
Next.js’s popularity on GitHub over time:
👍 Single Page App feeling
Since Next.js is built on top of React.js, it brings to it all the advantages React has like pre-fetching and the JSX template system to name a few.
👍 Automatic Code Splitting
Pages never load unnecessary code.
👍 Great learning materials
If you’re not familiar with building Single Page Applications you can get started very fast here10.
👍 You can jump to full PWA anytime
If a static page is no longer sufficient, you can enable a Node.js server for a full PWA experience.
👎 Learning curve
Comparing to what you have to learn going the Jekyll/Hugo route, it’s a lot harder to jump into Next.js, especially if you’re totally green with React, JS, JSX etc.
👎 Static page building time
It’s hard to beat Hugo in this area. With Next.js, building time for large websites could be pretty long.
Gatsby’s first release took place on October 6th, 2015. It’s worth mentioning that it has one of the most active communities of all the Static Site Generator projects - 807 contributors as of right now. To cut a long story short, Gatsby is a static Progressive Web App generator.
👍 GraphQL inside
Data directly into our components - in the shape and form we want. GraphQL is a pretty big topic, you can read more about it here.
👍 PWA by default
You don’t have to put in much effort to turn your Gatsby static website into an offline available app. Setting up Gatsby service workers is as easy as pie! Just add one gatsby-plugin.
👍 Growing plugin ecosystem
There are dozens of plugins, you can easily connect most popular Headless CMS, Google Analytics, image optimization, service workers and more! 11
👍 Data & code prefetching
Site would feel like a single page app while still benefiting from the performance of a static site.
👍 Great community and learning materials
It's easy to get started with Gatsby's step by step tutorial available here12
👎 Learning curve
You will need to have a solid grasp of JS, React, and GraphQL in order to get going with Gatsby.
👎 Long building times
Compared to all of the above Static Site Generators it takes Gatsby a lot of time to throw out the files after you hit the build command.
This is what we have learned so far, by using Static Site Generators at Bejamas. Let me wrap things up a little bit at the end:
If you’re seeking simplicity and a pretty short learning curve - you’d better go with Jekyll. Building a big site, you want to change and add a whole lot of new posts? Choose Hugo. In any other cases, I’d suggest you go with Gatsby or Next.js.
These are just my thoughts though. What do you think of it? Are there any pros or cons that I didn’t bring to the table?