Gatsby.js is a static site generator, using GraphQL and React.js. It’s a very modern approach to building a user interface (your website for example) on the web. The Gatsby team is doing a lot of great work with the project since it’s first version in June 2017, and third-party plugins provide and ecosystem for extending functionality, similar to the way WordPress’ plugin market works.
So what does a Gatsby site do, and why would you want to use it?
First off, Gatsby is fast. Blazingly fast. It’s fast in a lot of ways that developers like, but particularly in how quickly pages load. It does this in a number of ways like creating server-side rendered HTML files of your templates, and code-splitting. This means the user when they hit your site, download a small static file directly from the server – no need to request anything from the database. This file can be cached so it’s even faster. The file only contains the data required to show that page, lazy-loads images further down the page when they’re needed, and runs off and pre-loads other pages when you hover over the links for them.
Being a React.js ‘framework’, Gatsby inherits all of the benefits of the React ecosystem, and refines them to make development of a static website fast and maintainable for the developer. Your site will feel ‘app-like’ in it’s behaviour and performance. This also has major benefits for SEO.
Gatsby is best used when your site’s data isn’t changing every few minutes. For a more dynamic or real-time web-app use case, look at something like Next.js. When a new page or post is published in your CMS, Gatsby checks all the data and rebuilds itself, and uploads the changes to the server for your users.
Secondly, security. With only static files on your public server there’s little of interest for your hackers to hack. Interactions with your database are abstracted and run at build time, when Gatsby queries your CMS or data source, and creates the static files. These files don’t contain any information about that process.
Lastly, hosting static files is really easy! You just upload them to a host’s public folder and you’re done. Even for free on a host like Netlify. Sure you still have to host your CMS somewhere, so you could even put these static files on the same host.
Get in touch if you’d like to know more about creating a Gatsby-powered site for your business.