support masking (with transparency) like in SVG

[s-light]

source discussion on google groups

in SVG / Inkscape there is a Mask option:
http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Clip.html
https://www.w3.org/TR/SVG/masking.html#Masking

i have experimented with the clipMask and group.clipped property.
(would be good to include an example or link in the clipMask propertie in the documentation ;-) )
but it seems these do not support alpha/transparency - so they only clip.
example at sketch.paperjs.org
in line 80 you can un/re comment the clipping to see the different results.

[iconexperience]

You can do masking by using blendMode: 'source-in' on groups.

Here is a sketch to illustrate how this can be done.

Content without mask:

Mask:

Content with mask applied:

[iconexperience]

But unfortunately this uses the whole background as the mask. as you can see in this sketch that has a large opaque rectangle as the background.

[iconexperience]

Turns out you can do it by adding blendMode: 'source-over' to the masked group:

Here is the sketch

[Saket23]

Group inside group adds up a lot of latency , is there any way we can avoid latency if we have nested Groups ?