When are we going to see the death of SVG?

I have this bizarre mixed feelings about SVG, I loathe it and love it at the same time (according to urban dictionary the word is loave) and I hate myself for it - okay, hate is a strong word.

I constantly feel frustrated by its complexity, requirement for tooling (have you tried to create a path by hand) and half-arsed integration into the web of today.  I see the <svg> element much like I see the <object> tag, that is a boundary that rarely if ever should be crossed by mere mortals, a semi-permeable barrier where only through reverse osmosis can we wrangle some of the elements in our usermode. (to be read as, we can script it and hook it up in our app but that is about it).

The way I see it, once you get in to <svg> it is like a context switch, the HTML DOM and the SVG DOM will never really truly mingle.

But SVG has some serious awesomeness too - for one it is scaleable, two is vector based.... can you guess the third?  It has awesome graphical capabilities, you've seen the filters right and paths? There have been lots of project that I have worked on where I simply can't build what I want because it is not available in the "web" sans SVG.  I want to be able to apply filters with out importing a SVG declaration, I want to be able flow elements out along a path.

Why can't path be a css property?

p {
  display: svg; /* http://www.w3.org/1999/08/WD-SVG-19990812/styling.html */
  path: "M 100 100 L 300 100 L 200 300 z";

Text inside the <p> will be rendered along the path.  But what if <p> was a block element like a <div>?  Even better all elements be they block or inline will be rendered along the path...... That is powerful!

For me this is better than what we have now. I don't want to have to have <p><svg>......</svg></p> when I want to do something awesome that SVG lets me do, that just doesn't scale.
Picture of me smiling.

Paul Kinlan

I lead the Chrome Developer Relations team at Google.

We want people to have the best experience possible on the web without having to install a native app or produce content in a walled garden.

Our team tries to make it easier for developers to build on the web by supporting every Chrome release, creating great content to support developers on web.dev, contributing to MDN, helping to improve browser compatibility, and some of the best developer tools like Lighthouse, Workbox, Squoosh to name just a few.

RSS Github Medium