Hugo is an open-source static site generator and the more I use it, the more I like it. Unfortunately, my first choice was Jekyll, a Ruby-based generator, and it was terribly slow and hard to work with. Switching to Hugo decreased site compilation time from 14 seconds to 14 milliseconds, but I expected Hugo to slow down as I add more features, but it’s still blazing fast. Here are two new (to me) Hugo features I’ve been using during December:
Site Search
Websites tend to grow in size and my websites are no exception. Sooner or later, we have to find a way to make the content searchable and that’s one of the many use cases when static site generators can improve both user experience and developer happiness.
The thing is, site searches usually happen on servers so you have to send your query string and wait for a response. That introduces a significant lag between typing something and getting back the results. Not with “static” approach! There is nothing that stops us from generating JSON version of site content along with the default HTML version and that allows us to use client-side search libraries that can take that JSON input and show the results without making any additional network requests.
Photo Pipeline
Hugo can also read and modify raster images. That can be useful for displaying or removing image Exif data and for resizing images for certain use cases such as making smaller “thumbnail” versions of existing images. Different image filters can also be employed to adjust the images depending on user theme (light/dark).
I’ve played with this pipeline and created some kind of Instagram feed. I’m planning to continue working on it and I’ll probably use it as a place to share some of my photos.