ipfs-shipyard
feat: svg spritesheet for dir-index-html listings
ipfs.io and kubo use SVG images as data uris, and we want to add dir-index-html listings to service-worker-gateway as well.
We could create a spritesheet and add to this repo and pull in from both kubo and service-worker-gateway:
<!-- Sprite (external or inline once on the page) -->
<svg style="display: none;">
<symbol id="icon-audio" viewBox="0 0 24 24"> ... </symbol>
<symbol id="icon-video" viewBox="0 0 24 24"> ... </symbol>
<!-- etc. -->
</svg>
<!-- Then reference each in HTML (or mask background in CSS): -->
<svg class="icon-audio"><use xlink:href="#icon-audio"></use></svg>
Or we could create these svgs as individual files and then retrieve from CDN (or ipfs.io gateway).
References
- https://github.com/ipfs/helia-verified-fetch/pull/86/files#r1829575387
- https://github.com/ipfs/boxo/blob/09b0013e1c3e09468009b02dfc9b2b9041199d5d/gateway/assets/icons.css
- https://github.com/ipfs/boxo/blob/09b0013e1c3e09468009b02dfc9b2b9041199d5d/gateway/assets/templates.go#L19C1-L25C2
Sprite for filetype sounds very good, cuts down the number of requests/blocks.
However obligatory sidenote: be very careful with reliance on "retrieve from CDN or third-party gateway".
Mind that people use IPFS in private contexts (including private DHTs, private clusters and PNET) or can't depend on regular DNS system, and we have to design things with that as lowest common denominator in mind.
If Kubo generates HTML for dir-index-html listings and that HTML triggers fetching assets from external URLs it would break once DNS is censored, and/or be leaking the existence of private IPFS instances, and if implementers are not careful, including browsing history (by means of Referer and subdomain gateway domains etc).
So what we want is a sprite (to minimize the number of requests/assets/blocks), but implementations likely need to embed ipfs-css or fetch it from local gateway, similar how ipfs-webui works today (kubo has hardcoded CID, desktop bundles it with app).
