On xlink:href being deprecated in SVG

A reader wrote in to tell me we should update our articles about SVG <use> elements. The attribute we always use for them, xlink:href, is deprecated. Indeed, MDN says:

That’s pretty strong language, hence the reader’s warning. This is a bit surprising to me, as the SVG 2 thing got a little weird. It looks like it did become a Candidate Recommendation though.

So…

<!-- This is old -->
<svg>
  <use xlink:href="#whatever" />
</svg>

<!-- This is new -->
<svg>
  <use href="#whatever" />
</svg>

I like it. But does it actually work? Lemme fork my little old demo and change all the references. In a quick run through of what I have easy access to:

Better than I thought! But enough ?‍♂️ no-go’s there that up and switching everything seems far too dangerous, especially when xlink:href has support across the board.

Will browsers actually pull support? I’ll bet ya fifty bucks none of them ever do. There are tons of websites that use the attribute in the old format that will never update, and we know that browsers take breaking old sites very seriously (yay).

It feels like the same thing with, for example, :before and ::before. Yeah, ::before is the new and more correct syntax. But no browser will ever pull support for :before (I’ll bet ya another 50 bucks) because it just needlessly breaks sites. And because of that, it almost makes the most sense to keep using :before as you get the widest swath of support that way.

I probably won’t be updating older articles using <use xlink:href="" /> unless something bizarre happens and some browser actually does pull support.

The post On xlink:href being deprecated in SVG appeared first on CSS-Tricks.

Source: CSS-tricks.com