Settings

Theme

JavaScript in SVGs

devdailydigest.tech

21 points by Architrixs 2 years ago · 12 comments

Reader

dang 2 years ago

Recent and related:

SVG images can contain JavaScript - https://news.ycombinator.com/item?id=39079943 - Jan 2024 (50 comments)

pseudosavant 2 years ago

The more I learn about SVG the more amazed I am at its capabilities. Realtime updated SVG charts/images is a very interesting idea. I wonder what kind of component model you could build around SVG? If the SVG JS can determine the SVG's document origin, you could parse GET parameters to dynamically render the SVG based on the URL.

  • solardev 2 years ago

    FYI SVG charts have been around for a while and there are many libraries that use them: https://blog.logrocket.com/comparing-most-popular-javascript...

    Depending on your use cases and complexity though, sometimes it's better to render to canvas instead (usually for performance reasons). JS and WASM are way more optimized than SVG is, so sometimes it's better to do the heavy calcs and then render raw pixels, instead of relying on SVG geometries.

sroussey 2 years ago

Yeah, but JS modules only on Firefox. :p

Still though, I think this was a mistake to do.

Hopefully scripts are disabled when including svg via an img tag.

  • rezmason 2 years ago

    I think for many reasons the security model for code execution in HTML and SVG ought to be completely identical. They ought to just be slightly different DOM specifications.

    In other words, if I can set an SVG file as the image of an img tag or as the URL in a background-image style property, then I ought to be able to use an HTML file, too— and JS should run in both or neither, with the same sandbox properties. Probably neither.

    Likewise, if I can set an HTML file as the contents of an iframe, then I ought to be able to use an SVG file that way, too— and JS should run in both or neither, with the same sandbox properties. Probably both.

    • pitherpather 2 years ago

      I have seen immediate-mode SVG for GUIs.

      Is parsing and rendering SVG well-pipelined at this point? Offhand it might be cache-friendly. I have not tried a simple elapsed-time-in-loop test, but to me geometric screen-painting happens instantly enough.

      I can imagine a separate branch in computer evolution, if PCs had not happened, where graphical terminals would have evolved to render something SVG-like, support a mouse, and send back simple mousedown/mouseup/x/y data.

pcthrowaway 2 years ago

Can't wait for someone to put react in an svg

beny23 2 years ago

Sounds like an attack vector

  • uicompat 2 years ago

    I know you’re implying the js specifically but using svg rendering as an attack vector was where the name “operation triangulation” came from with the recent high profile exploit.

    They would draw a triangle and then hash the result to get a detailed bowser fingerprint of the victims machine.

    https://m.youtube.com/watch?v=1f6YyH62jFE

johnsutor 2 years ago

Yet another reason to ensure CSP headers…

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection