Nakodo 's landing page has no images on it. Not "optimised images", not "lazy-loaded images": no <img> element, no background image, no sprite. Every illustration is an inline SVG, drawn in components, stroked with CSS variables so a dark panel can invert it.

The bill for that arrives as HTML:

$ curl -s -o /dev/null -w '%{size_download}\n' https://nakodo.app/ 596297 $ curl -s -H 'Accept-Encoding: br' -o /dev/null -w '%{size_download}\n' https://nakodo.app/ 52023

Enter fullscreen mode

Exit fullscreen mode

596 KB of document, 52 KB on the wire. I went looking for where the 596 KB goes, and about 226 KB of it turns out to be the same path data written twice.

What the document is made of

$ curl -s https://nakodo.app/ > home.html $ grep -o '<svg' home.html | wc -l 78 $ grep -o '<img' home.html | wc -l 0 $ grep -o ' d="' home.html | wc -l 507

Enter fullscreen mode

Exit fullscreen mode

Measuring the pieces in Python rather than with grep gives the split:

Part of the document Bytes

Whole document…