My Hugo blog was downloading 3.6 MB of JavaScript and 40 KB of external CSS on every page load. For a static blog with mostly text and a few diagrams, that was absurd. Here is how I fixed it. HTML: 86 KB JavaScript: 3.6 MB (Mermaid + KaTeX) CSS: 40 KB (KaTeX stylesheets) Problem: render-blocking scripts loaded on every page for math and diagrams Adding minifyOutput = true to hugo.toml shrunk HTML
Ages ago when CSS grids came with a repeat() function to simplify defining repetitive columns and rows, I was not alone in wishing for this function to be made generic and work in any context. After seeing Wes Bos on BlueSky wishing for this exact concept, specifically for repeating segments in a shape() definition, I chimed in with my +1's on making repeat() generic across CSS Without delay, @no