Eleventy is a static site generator that we use to build blazing-fast websites, like the one you're currently on. In this post, we'll explain what a static site generator is, the benefits, and compare Eleventy to the alternatives.
What is a Static Site Generator?
On most websites, visitors request a page from the server, which then generates the page using code and other assets like images. Once generated, the server sends it to the visitor for viewing. In this case, we say that the page is dynamically generated.
With a statically generated website, we instead generate all the pages from the code and asset files in advance. We keep these generated pages ready, and send them to the visitor as soon as they request them.
What are the benefits of statically generated websites?
Having the page generated in advance means faster page loads for the visitor! Faster pages lead to increased conversion rates, and higher search engine rankings.
Static websites have another major benefit: security. Since we generate the pages in advance, we don't even need a traditional server to serve our website. We can instead host the generated pages on a CDN (content delivery network) using a service like Netlify. A CDN is much simpler than a website server, and doesn't need us to do any security or maintenance work on it. This eliminates the need to spend so much time and money on maintenance, monitoring or security audits.
Eleventy vs Jekyll or Hugo
There are other static site generators, like Jekyll and Hugo, which each have their own set of pros and cons. The deciding factor for us is that Eleventy uses JavaScript, which is a language we already have to use on every website project.
Limiting the number of languages we use for projects helps us to master those languages. It also means that if our clients ever want to get someone else to work on the website, it will be easier for them to find a developer. They will only need to find a JavaScript developer, rather than a developer that knows multiple languages.
Eleventy vs Next.js or Gatsby
Next.js and Gatsby are two popular ways to build websites recently. Both are based on React, and allow you to build statically generated websites.
While both of these options can achieve decent page loading speed, they fall far short of Eleventy. This is because they are based on React, and as a result, have to ship a lot of JavaScript with every page. The extra JavaScript makes the website files larger, which take longer for users to download.
Eleventy vs WordPress
WordPress can have many downsides, depending on how the developer uses it. For the sake of a fair comparison, we should compare a custom-coded WordPress website to a custom-coded Eleventy site. WordPress sites built with page builder plugins will have extra drawbacks.
The downsides to a custom WordPress site are the same as for any website that isn't statically generated: security and page loading speed. We've moved away from using WordPress at our agency, for these reasons.
Eleventy vs Webflow
We like Webflow at Propeller Digital. We use it for some projects, where it makes sense to do so. It takes away the issues of security and maintenance, as the hosting is all managed for you by Webflow.
It can also give good performance scores, but not on the same level as what we can achieve with Eleventy.
Webflow also has some limitations, as it doesn't give you full control like code does.
The upside is that it is cheaper to have your website built on Webflow than to have it custom-coded.
If you are confident that you won't run up against Webflow's limits, and the extra performance of Eleventy isn't worth the cost for your use case, Webflow can be a good option.
Conclusion
Eleventy is a powerful tool that allows us to build fast loading, secure websites. We use it for all of our custom-coded sites here at Propeller Digital, and have been delighted with the results!
