Gatsby vs. Wordpress - 5 Reasons to Choose Gatsby Over a Traditional CMS

January 06, 2021

gatsby vs wordpress

The internet runs on Wordpress. According to web technology survey firm W3Techs, Wordpress powers an astounding 39.2% of the web. This kind of dominance is not surprising - Wordpress is good at what it does. If you ever feel the need to share your cupcake recipes or rant about the Deep State, it takes less than half an hour to get a blog going from a hosting platform like BlueHost. It’s pretty cheap too. Hosting usually costs less than $10 a month.

But Wordpress is nearly two decades old now and it’s starting to show its age. Is Wordpress still the best solution for blogging in 2020 or are there other platforms we should consider?

The web has evolved considerably since the Space Jam website first came out in 1996. One of the latest architectural paradigms is the Jamstack. The Jamstack leverages pre-rendered content served through a CDN and takes advantage of APIs and serverless functions to make a website dynamic. In English, that means it’s fast and modern, with all the features that today’s users expect.

In the Jamstack space, Gatsby is one of the most popular options for a number of good reasons.

1. It’s Blazing Fast

lighthouse scores of command line zen

Pictured above is the performance score for my Gatsby blog - using Google’s tool for measuring page speed, Lighthouse.

The proof is in the pudding. If you’re on Chrome, pull up Chrome Developer Tools and run Lighthouse on my blog. Now compare that to a website made with Wordpress (if you’re not sure how, Google has a simple guide here).

Done? There’s a big chance that you’ll see a bunch of red or yellow scores for the Wordpress sites. From what I’ve seen, most pages made with Wordpress score in the low 20s-40s and these include well-known magazines, marketing sites and blogs.

Wordpress will almost always be slower than Gatsby. All hosted Wordpress sites have to make a request to its servers, retrieve that information and then render that on the page. A Gatsby site, on the other hand, is a bunch of static files composed of HTML, CSS and JavaScript that have already been pre-rendered during build time. All that’s left to is serve them up.

To make matters worse, Wordpress sites are all too often loaded with bloated plugins which slow down the site to a crawl. If you’ve ever been stuck waiting on a Wordpress blog crammed with ads, pop-ups and large, unoptimized images, you know what I’m talking about.

Gatsby has performance baked in to its DNA with features such as image optimization, code splitting and intelligent prefetching.

Speed matters. Google has said that page speed is a major factor in ranking your website and that the slower your page loads, the more likely it is that your users will give up and leave.

A slow site isn’t just an annoyance - it means less views, less users and less revenue.

2. It’s Secure

Anybody who’s run a Wordpress site before knows that plugin maintenance is a constant hassle. Plugins are a security nightmare. Many well known plugins have been breached in the past, leaving sites at the mercy of hackers.

Not only is Gatsby more secure, but it’s also much more difficult to take down. Gatsby’s site proudly declares in bold “A Gatsby site’s attack surface is nonexistent.”

Because Gatsby sites are just a collection of static files served up on a content delivery network, it has no server or database and is protected against malicious requests or DDOS attacks.

Running a Wordpress site means constantly staying up to date on security patches for your plugins. Gatsby sites, on the other hand, are truly “set it and forget it.”

3. It’s Dirt Cheap

Because of the way Gatsby sites are set up, they don’t require expensive hosting. It’s easy and cheap to scale and at lower tiers, it’s literally free.

That’s no joke. I host on Netlify for zero dollars. All I’m paying for is the domain. My free tier limit runs 100GB a month and with my blog I barely reach 300 MB. It’s a ridiculously good deal.

Don’t get me wrong, Wordpress hosting is cheap. On popular providers such as BlueHost, you can essentially get deals for as low as three dollars a month for the first two years. But cheap is not free and eventually, after the promo pricing ends you’ll be paying around roughly eight to ten bucks a month for the low tier option. Again, not a big deal. But if you plan on launching more sites, it quickly adds up.

4. It has a strong plugin ecosystem that comes with everything you expect from Wordpress such as SEO

When I first switched to Gatsby, my biggest fear was the trade-offs of adopting a new platform. Sure, Gatsby is fast, but Wordpress has been around for ages. It has a large, mature ecosystem with themes, services, tutorials and plugins for everything, including SEO, page-builders, forms, caching and e-commerce.

Thankfully, Gatsby has a vibrant ecosystem of its own. It’s got plugins not too different from what you have in Wordpress, that do everything - from adding Google Analytics to integrating Shopify. There are plugins dedicated to all common use-cases such as SEO, e-commerce, payment and search. Some of these plugins even work right out of the box. For example, adding a sitemap, is as easy as running npm install gatsby-plugin-sitemap. Gatsby has been more than enough for all my blogging needs.

5. You don’t have to give up Wordpress

Here’s the rub, you don’t even have to give up Wordpress.

Gatsby allows you to wire it up to any CMS you like whether it’s Wordpress, Ghost or Sanity. This practice is known as using a headless CMS.

This means that coworkers unfamiliar with code - such as content writers and SEO specialists - will still be able to write their posts and pages in the Wordpress interface that they know and love, all while enjoying the advantages of Gatsby and the Jamstack. It’s a win-win.

The caveat of course is that you would have to have somebody who knows their way around code to wire it up in the first place. But if you are an agency with web developers on staff, setting up a Gatsby site and having them hook it up to Wordpress or Contentful isn’t that complicated and provides a ton of upside.

Who would benefit from Gatsby?

Gatsby is perfect for companies looking to build fast marketing pages or e-commerce sites. In fact, organizations such as Figma, Braun and Little Caesar’s use Gatsby for this exact purpose. The Gatsby website has a showcase of companies, organizations and individuals who currently use Gatsby.

Gatsby is also perfect for freelancers. The cheaper hosting costs and simple reuse of themes allows them to quickly build fast, performant websites for their clients while taking home more profit.

Another potential demographic are web agencies looking to deliver more value for their customers. Agencies that have done the research and are aware of the benefits of the JAM stack will be able to deliver faster, more secure sites to their clients and help them gain an edge over the competition.

When should you stick to Wordpress?

Gatsby is not always the right solution because it does require familiarity with code or working with somebody who does.

If you are a small business owner setting up a website by yourself, it probably isn’t the best use of your time to fiddle around with JavaScript - Wordpress or Squarespace is your best best.

If you are running a simple, one-person e-commerce store selling cat pajamas, then Shopify or Woo Commerce will be much easier to manage.

If you’re working with colleagues, the majority of whom are comfortable with Wordpress and heavily invested in its ecosystem, then it doesn’t make sense to stage a coup to force everybody to use Gatsby.

Even for seasoned coders, Gatsby may have some things they don’t like. Gatsby makes abundant use of GraphQL, which some people find difficult to work with, and it requires familiarity with React. Thankfully there are a lot of good non-React options such as Gridsome or Nuxt (based off Vue) and Scully (which uses Angular). Another path to explore is a hybrid framework such as Next JS, which also uses React but unlike Gatsby allows you to use server side rendering for some pages and static for others.

Gatsby also uses JavaScript which raises the hackles of many a backend dev. If you have an irrational (though not totally undeserved) hatred of the JS ecosystem and its Balkanized patchwork of packages, there are many other options in the Static Site Generator space. Hugo (built on Go) and Jekyll (built on Ruby) both use a relatively simple templating language to build pages.

The Deciding Factor

At the end of the day, the most important factors for me were speed, cost and familiarity with the JavaScript and React ecosystem.

As a programmer with an interest in freelancing and building side projects, Gatsby allows me to quickly bootstrap fast, secure websites from custom, pre-built templates. It currently powers my main blog - and will be the foundation for all my other blogs going forward.

If you care about speed, cost and security, choosing Gatsby is a no-brainer.