Canvas

canvas是通过JavaScript来绘制2D图形的，是逐像素进行渲染的。在canvas中，一旦图形绘制成功就就不会再得到浏览器的关注，如果图形位置发生变化，那么整个场景也要重新绘制。

SVG

SVG是一种使用XML描述2D图形的语言。在SVG中，每个被绘制的图形都被视为对象，如果SVG对象的属性发生变化，浏览器可以自动重现图形。

相同点

canvas和SVG都是用来2D作图的。

不同点

1. canvas是位图，SVG是矢量图。

2. SVG 节点过多时渲染慢，Canvas 性能更好一点，但写起来更复杂。

3. SVG 支持分层和事件，Canvas 不支持，但是可以用库实现。