mrkaluzny homepage

Proudly announcing support for Gatsby v3

Mar 13, 2021

tl;dr: Gatsby's v3 release brings massive improvements to the developer's workflow and user experience. Within a week I migrated our stack to use the new version of Gatsby. Part of that was updating Clean Commit's minimalistic tailwind starter for Gatsby called Henlo.

Gatsby update - it's finally here

Gatsby is a foundation for a majority of projects I'm working on recently. Static websites are great that's why when I decided to rewrite this website I went with Gatsby over WordPress.

When 2021 started I decided to pursue performance as the most important factor for the software we create. Why? Performant websites have to be well thought through, therefore should have higher quality in general. Additionally, the speed of your website affects your bottom line (faster websites have better conversions are easier to optimize for search engines) and user's experience (it's 2021, people don't like to wait more than 2s!).

Best performance requires the newest technology and neck-breaking adoption for updates is in my view fundamental to achieving that goal.

With Gatsby v3 we're bringing support for cutting-edge image optimization, and next-gen image encoding format AVIF (supported only in Chrome and Opera at the time of writing).

With Incremental Builds that Gatsby 3 adds across all deployment environments, we should see quicker generation times which can be crucial for our clients with larger projects.

Henlo - Minimalistic Gatsby starter optimized for SEO & performance

Under Clean Commit's brand, we've published our open-source stater - Henlo. Having already migrated some of our projects to Gatsby v3 this week, we had to update our starter as well.

Henlo lays at the base of all of our internal projects and it's open to devs from around the world. Today with Gatsby 3!

After updating to Gatsby 3

I had to rewrite parts of that websites due to their outdated code base. Many components were removed, some added. The biggest change was implementing a new plugin for image optimization.

After a couple of hours, the results are... well great! On the desktop, I finally managed to reach a 99 performance score and saw a 20 points jump in the mobile score (from 64 to 84 on the homepage). Other than that I love the new dominant color placeholder for images, which makes the blog look awesome even when waiting for images.