←back to thread

Nice things with SVG

(fuma-nama.vercel.app)
571 points fmerian | 1 comments | | HN request time: 0.206s | source
Show context
LegionMammal978 ◴[] No.43666631[source]
One fun thing that can be done with SVG files: you can use entities in an inline DTD to define constants to be shared across different places in the file. You can see some great examples of this in the SVGs in David Ellsworth's "Squares in Squares" page [0].

The major browsers have no issues with this, though note that some tools like Inkscape won't parse the DTD nor expand the entities.

[0] https://kingbird.myphotos.cc/packing/squares_in_squares.html

replies(5): >>43666756 #>>43668277 #>>43668668 #>>43669828 #>>43671211 #
tannhaeuser ◴[] No.43671211[source]
You say "entities" but that term is actually the name for SGML/XML's mechanism to define arbitrary syntactic content for reference/reuse with entity references a la &ref, whereas in SVG you can park shapes/paths/whatever under refs, giving those an id attribute value, and then <use> those element in the body SVG content, which is also what the page you linked is using (for each individual SVG ie. there's no sharing of rectangles across the many pictures since these are pulled-in individually via <embed> inot their own DOM rather than used as inline SVG).

I wonder why SVG's original designers found it necessary to supply an ad-hoc re-implementation of the entity mechanism. I think it might have to do with how rendering properties can be overridden at the usage site? At least I don't think it was established that browsers ignore entity definitions or basically anything in the document prolog/DOCTYPE considering SVG was part of W3C's push to replace HTML's SGMLish legacy syntax with XHTML/XML.

replies(2): >>43672094 #>>43673075 #
1. LegionMammal978 ◴[] No.43673075[source]
> which is also what the page you linked is using

To be clear, it's using both of them for different purposes, you'll find both <use> elements and <!ENTITY> declarations in files like https://kingbird.myphotos.cc/packing/square-11.svg. You can't <use> a numeric quantity in an attribute, the closest alternative for those would be CSS variables.

As for the existence of <use>, I agree with jarek-foksa, the idea is that the original element and all its clones from <use> are linked in the DOM at runtime, as opposed to DTD entities which are baked in textually. Also, most people hate XML, I'd imagine they'd hate internal DTDs doubly so, especially with how little information can be found about them outside the XML standard.

(Browser devs also love to beat the drum of minimizing attack surface, so it's a bit surprising that DTDs and XML stylesheets still work at all. I'd expect them to tear out that functionality in a heartbeat if it were ever used in a modern exploit.)