Hugo static site upload woes and a way forward
Making the Hugo → S3 upload process much more efficient by tracking file hashes.
Blog
Hugo cache busting
Justification
Although caching can make page loads notably faster, it comes with a cost. Browsers aren’t always capable of taking note when a cached resource has changed. I’ve noticed recently that Safari utterly refuses to reload .css files even after emptying the browser cache and clearing the web history.
Background
With a lot of help from the a pair of articles written by Ukiah Smith, I’ve developed a workflow for dealing with this problem during the deployment process. He describes two approaches to the problem of static asset caching, one an improvement on the other. I’ve implemented something like what he describes using the git file hash to modify the filename of the css files. When the client browser sees a new filename, it always reloads the resource. So the problem is to figure out how to only change the filename when the contents have changed. Let’s say you tweak a css parameter and want to ensure that client browsers load the correct version. We can use the git file hash, and append it on the filename. Then the only remaining problem is to make sure that the page head template knows how to find the correct version to bake into the pages. Here, our approach is the same as Smith’s.
A folder-based image gallery for Hugo
Hugo is the platform I use to publish this weblog. Occasionally I have the need to include a collection of images in a post. Mostly this comes up on other sites that I publish. Fancybox can do this; but it wasn’t immediately clear how to direct Fancybox to create a gallery of images in a page based on images in a directory. Previously, I’ve solved this in different ways, but I was anxious to find a simple shortcode-based method.
A Simple Styling Shortcode for Hugo
A Hugo shortcode used to style inline text in a post. I use it here to style Russian text in my posts.
Markdown anchors
TIL how to use anchors in Markdown documents. I needed to use this in a long blog post in my Octopress blog and was stymied.
As usual, I found the answer on Stack Overflow.
Beam me [up](#enterprise), Scotty
<a id="enterprise"></a>It’s a great way to move around in longer content.
2014-03-03: I no longer publish using Octopress; but this should work in most cases where Markdown is used. Bitbucket is a notable exception. For Github wiki, you’ll need something like: