Note: I went into more detail on the why for this in my personal blog on the post Speed up your Gatsby site with 1 line of code 🤯. There's also a bonus tip there fore further improvements ;)

1. Gatsby uses React as its rendering engine;
2. Preact has the same API and is compatible with React, but is significantly smaller;
3. gatsby-plugin-preact automatically does the change for you, with no side effects (at least known to me);
4. Simply yarn add gatsby-plugin-preact preact and add 'gatsby-plugin-preact' to your gatsby-config.js plugins array;
5. And, voilà, you've got yourself a website with ~100kb less minified JS (uncompressed, 30.5kb for gzipped), which will load and parse faster, waste less bandwidth and perform better on Lighthouse scores, leading to better SEO 🎉

Again, for more info on this, refer to the full post on my blog 😉