[whatwg/dom] Add convenient, ergonomic, performant API for sorting siblings (#586)

[Could've sworn I filed this already, but maybe we only <a href="https://lists.w3.org/Archives/Public/www-style/2015Jun/0244.html">talked about it</a>.)

Back in 2015 Bo Campbell from IBM reported a major accessibility problem with websites using Flexbox: they were using the `order` property to to perform semantic re-ordering of elements, because the `order` property was much easier and more performant than re-ordering with JavaScript.

The problem with this is that the re-ordering isn't reflected in the accessibility tree or in the navigation order: CSS deliberately forbids this, since the point of this property was to create a divergence between the visual positioning and logical ordering of the elements.* Our continued position is that semantic ordering belongs in the source.

<small>* The reason CSS allows this divergence is because visual perception is 2D and is affected by things like the gestalt principles. Size differences, color contrast, spatial grouping, and other techniques are regularly used by designers to guide the eye around the page in patterns that don't follow a simple top-left->bottom-right coordinate scan;  allowing the spatial order to diverge from the source order lets designers map the source order to the intended visual perception order. (This is all out-of-scope for the issue, just wanted to head off any off-topic comments like “why does CSS define `order` this way”.)</small>

However, because reordering elements in the DOM is so unwieldy, authors are sorely tempted to use `order` for it. <a href="https://twitter.com/jensimmons/status/964360059923742720">Roma Kamarov’s sorting solution with CSS variables</a>, for example, is so much more straightforward than a JS approach. It would be much better if the DOM offered an API for sorting siblings that was as simple and powerful as sorting with `order` in CSS; even if it can't be quite as performant as a CSS-only solution (since it has to do strictly more work by altering the DOM tree as well), it would hopefully be useful enough to head off some of the more misguided uses of CSS, and provide a useful convenience to people using JS regardless.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/whatwg/dom/issues/586