Struggling to understand Hugo Caching

support
1

The website repo is here Personal Website. I was running my page through Google’s PageSpeed Insights and encountered the following suggestion.

image
image940×360 10.9 KB

This confused me since I thought that Hugo automatically cached resources via its asset pipeline. Looking at my imported theme’s repo (Search for “fingerprint” - Poison), it does seem to use this pipeline.

I’ve read the caching documentation listed here Configure file caches, but I would think that the default behavior of “maxAge = -1” is not relevant here (I did try changing it to “10h” just to test but didn’t seem to affect anything).

When I load the site and inspect the page, navigating to Application → Cache Storage displays the message “No cache Storage detected”.

I’m sure I’m just overlooking something simple or misunderstanding what caching is, but I’d appreciate any comments.

2

The caching insights in your screen capture are about what happens after the build (e.g., how your web server is configured to set cache headers).

Hugo’s caching mechanisms are about what happens during the build (e.g., use a cached image instead of reprocessing it during the build).

3

Thanks, this does clear up my confusion!

P.S. - In case anyone else stumbles upon this, with further searching, I’ve realized that the “…navigating to Application → Cache Storage…” is not where you want to view the cache storage (this is for offline applications or PWAs). You should properly look at caching under the Network tab in DevTools. GitHub Pages has it automatically set to 10 minutes (and doesn’t seem to be editable, so it will always fail the PageSpeed Insights test).