SVGとかCSSでマスクとかクリッピング

Path2D

Canvasの新しいAPIらしい。
https://developer.mozilla.org/ja/docs/Web/API/Path2D/Path2D

SVGのパスのｄ=""入れれば、そのパスが描画される。

https://github.com/google/canvas-5-polyfill
んで、これがPolyfill。
中に入ってる、svgpath.jsというParserが優秀っぽい？

Snap.svgでアニメーションさせたやつをCanvasで使うパターンもありかも？

SVGマスク

SVGのなかで、mask="url(#maskimg)"これで画像マスクしてくれるらしい。
IE9〜対応なんでコレ結構あり？

色々書こうとしたけど、下のリンクがわかりやすいので諦めます。