Hacker News new | ask | show | jobs
by DelaneyM 900 days ago
I went down this rabbit hole about 15 years ago, I ended up hand-rolling a transparent .gif which I think was 15 bytes? Small enough that we inlined it as cdata data urls. (Is that still a thing in HTML? It’s been so long…)
3 comments

You can do that kind of thing in html today.

I use this embedded SVG for the logo on a page:

<img id="logo" src='data:image/svg+xml;utf8,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2054%2050%22%20version%3D%221

I think I recall using a base64 encoded png at one point for a different project in the same way.

Minimizing bytes was not the reason for this. It was to tidy up the directory listing as this html was used as a self contained local file. I didn’t want a separate logo file hanging around and risk getting lost.

That's feasible in XHTML, but it don't think it's in the html5 spec.

Instead, you can use a data URL, though you'll be wasting bytes specifying the mime type and base64 encoding the rest.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_...

That’s the one! Data URL! Thanks. :)

The primary way we used it was as the body of a tracking gif, returned as binary. But we also used it as a spacer here and there inline in HTML using the data URI. When embedding in HTML the file size is mostly relevant for brevity.

Wow, that takes me way back.

For some reason "CDATA" is ringing a bell and I don't know why. Was that a thing way back when?

EDIT: oh right, it was an XML/XHTML comment thing.

Not comments. Character escaping. (i.e., raw Character DATA)