← all tags

Tagged #hugo.

15 entries.

0 entries
week 1
0 entries
week 2
0 entries
week 3
0 entries
week 4
0 entries
week 5
0 entries
week 6
0 entries
week 7
0 entries
week 8
0 entries
week 9
0 entries
week 10
0 entries
week 11
0 entries
week 12
0 entries
week 13
0 entries
week 14
0 entries
week 15
0 entries
week 16
0 entries
week 17
0 entries
week 18
0 entries
week 19
0 entries
week 20
0 entries
week 21
0 entries
week 22
0 entries
week 23
0 entries
week 24
0 entries
week 25
0 entries
week 26
0 entries
week 27
0 entries
week 28
0 entries
week 29
0 entries
week 30
0 entries
week 31
0 entries
week 32
0 entries
week 33
0 entries
week 34
0 entries
week 35
0 entries
week 36
2 entries
week 37
3 entries
week 38
0 entries
week 39
2 entries
week 40
0 entries
week 41
0 entries
week 42
0 entries
week 43
0 entries
week 44
0 entries
week 45
0 entries
week 46
1 entry
week 47
2 entries
week 48
0 entries
week 49
2 entries
week 50
0 entries
week 51
0 entries
week 52

12 entries over 52 weeks of #hugo activity. Less More

Writing 12 posts

Bits 3 bits

update #wilhelm.codes, #hugo & #performance

Page loads had been creeping up again, so I went looking. Turns out I’d been quietly serving enormous screenshots. One post was pulling 5.1 MB of PNGs, and a single one of those was a 1.96 MB app screenshot sitting in a column 736 pixels wide. Oof.

The fix was mostly plumbing. My img shortcode was handing the raw src straight to the <img> tag, so Hugo never got a look in. Everything now goes through one partial that resizes to the width it actually displays at, re-encodes to WebP and emits a srcset, plus width and height so the layout stops jumping around while things load. Markdown images get the same treatment through a render hook. The awkward bit: images under static/ aren’t resources, so Hugo can’t touch them. A second mount in hugo.toml fixes that without breaking any existing URLs.

While I was in there I dealt with the JavaScript. Every page was carrying all seven inline scripts, even the 90-odd pages with no code blocks, no zoomable images and no locked series titles. Those three now load only where they actually do something. The two that genuinely run everywhere moved into one small fingerprinted bundle, so your browser fetches it once for the whole visit instead of re-reading it on every page. I also finally turned on HTML minification, which I’d apparently never bothered with.

Where it landed:

whatbeforeafter
Images the site serves12.3 MB1.5 MB
HTML over the wire, mean per page10,236 B6,671 B
Worst offending post, first paint5.1 MB112 KB

That last one is about 46 times smaller. Nothing changed visually, which was the whole point. The sparks still spark and the locked titles still scramble.

One last silly thing. I added a new short code to style “Plant Smart” as “Plant🌱Smart”. Fun!

update #wilhelm.codes & #hugo

Decided to introduce a new projects page to showcase some of the bigger things I’m working on. I’m still working out the kinks and I’m not 100% sold on the current design. Each card is powered by a .toml based datasource in Hugo, contains a kind of linear heatmap of activity related to the associated project’s tag as well as the 5 latest related posts. Good enough to publish, I guess.

I also can’t decide on which activity graph animation I like the most. 😅