Great write up, excellent explorables. I skimmed some parts so forgive me if this was covered, but I wonder what happens with overlapping shapes in this approach. For example, a white background with a black disc and then a white disc of the exact same size and position would probably leave a fuzzy gray hairline circle? With regular antialiasing it should be all white.
What happens during overlap, is something you control fully, at every step. (Except when using this with MSAA, as that is implementation defined) How intersections happen when blending shapes of multiple draw calls or multiple quads is defined by the blending function you set before issuing the draw call. In WebGL the call is blendFunc() [1] and there are a bunch of options.
How to blend multiple shapes on the same quad, within a draw call is shown in the section "Drawing multiple?". There you fully control the intersection with the blending math.
Finally, there is always the gamma question, which is true for all AA solutions. This is not covered in the post, but that might mess with the results, as is true for any kind of blending.
[1] https://developer.mozilla.org/en-US/docs/Web/API/WebGLRender...