Image credit: Televisions with Static by Alpha - CC BY-SA 2.0
I’m migrating this website from Drupal to Gatsby.js.
Why Switch from Drupal?
This site has been running on Drupal 7 for almost exactly 10 years. I originally created it to get a free beer at the Drupal 7 release party on January 11, 2011. Not a bad run and Drupal 7 still has nearly 2 years left before EOL.
The main reasons to switch away from Drupal are:
- Drupal has become more of an enterprise-level tool and this site isn’t exactly “enterprise”. I don’t even need a CMS.
- I’ve been working on a lot of other technologies since 2011.
- It’s hard to beat the performance and security of a static site.
- Upgrading to a new version of Drupal is quite a lot of work.
Why Switch to Gatsby?
I wanted to go with a static site generator, since I liked the speed and simplicity. Also, I wanted to get rid of cookies entirely. I’m not trying to get customers and track conversions, so there’s no need for Google Analytics. My Drupal site hasn’t been hacked—I even survived Drupalgeddon, but you do have to keep up with patches. A static site is less likely to be hacked than a CMS.
I initially considered a conventional static site generator that takes markdown and spits out HTML. Jekyll was a front-runner, since I’m fairly comfortable in Ruby and it seems well suited to a simple blog. This would have been the simplest solution, but I decided to keep looking.
On this new Gatsby site as with many static site generators, the content is in the form of Markdown files. Since I’m using a programming editor (VSCode) and on GitHub all day, I find it easier than logging in to my Drupal site and navigating the admin interface.
- Speed - one of the best things I can do for people reading the blog is to make it fast.
- Simplicity - no database, no cookies, just a web page.
- Learning - beef up my React experience.
- Ease-of-use - the posts here are just markdown files.
The one thing I might be stretching a bit is “simplicity”. The source code for this site shows it’s not so simple. More on that in a future post.
What Has Changed?
The site is a lot faster. Even in develop mode, page transitions are almost instant. This is because there isn’t a CMS doing dozens of SQL queries for each page load and because Gatsby prefetches links, pages are displayed as quickly as a SPA.
I’m getting rid of cookies. The fairly innocuous session cookie from the CMS is not needed—there are no logins. Google Analytics is gone. If I was trying to monetize page views, I would have a reason to use it. I had it installed on Drupal out of curiosity, but it has a privacy cost.
The Twitter widget and social sharing links are gone. I don’t really care about that stuff and there is a privacy cost. If you want to share a link, I have faith that you’ll be able to copy and paste.
There are new previous and next page links at the bottom of each article. This came for free with the Gatsby Starter Blog template. A simple thing, but it was more complicated that it should have been in Drupal.
You won’t notice unless you look under the hood, but I used Tailwind CSS for the first time. I was a bit sceptical of this approach, but it makes more sense once you pair it with PostCSS.