Last post, I revisited a bad decision that I made yesterday and decided to remove Font Awesome from my site. It proved to be way too many bytes transferred to all of my pages in order to avoid rendering images on my contact page. And since I had to download the entire font on my contact page, it ended up being a very poorly thought out optimization. SiteImp showed me the error of my ways and I’m a very happy founder.
This post, I’m going to cover some really basic ops. One of my deployment habits is to always minify my html and css before I deploy it. It doesn’t really save that many bytes, but it saves a few. And this gives me a chance to talk a little bit about [DigitalOcean’s App Platform]https://www.digitalocean.com/products/app-platform/. I’ve been a DigitalOcean customer for a very long time and have always been happy with the service. So when the chance came to try out their App Platform with some static sites, I jumped at the chance. It seemed like a great, relatively low risk way to try out something that I wasn’t really used to.
I’m one of those people who actually likes using command line so app platforms like this traditionally feel a little like cheating. But I’ve had a few sites hosted on DigitalOcean’s App Platform for almost two months and honestly, I’m a fan. I miss out on some tuning opportunities but gain incredible speed. If you’d like to host something static, I highly recommend DigitalOcean’s App Platform - it’s a good platform.
Changing the build command in the App Spec
When you use DigitalOcean’s App Platform, you’ll control your builds with a file called your-app-name.yaml. This is your app spec. By default, if you deploy a Hugo site to DigitalOcean’s App Platform, your yaml file will include:
static_sites: - build_command: hugo -d public
Replace that with:
static_sites: - build_command: hugo -d public --minify
The next time you deploy your site, your front end code will be minified. It’s an extremely easy way to eke out slightly better performance.
I’m going to run another SiteImp audit and let’s see what getting rid of Font Awesome in favour of images and minifying my front end code have accomplished.
- Improving hluska.ca’s performance with a Siteimp audit
- Eliminating render blocking resources part 1 - rel preload
- Thinking through css on hluska.ca
- Checking in on those changes
- Investigating Font Awesome on my contact page - last post
- Minifying my site with Hugo on DigitalOcean App Platform - this post
- Writing a Hugo shortcode to optimize my images with UI Kit - next post
- Final results from my site improvement program