- svg
- 用xml技术来描述二维图形的语言
- svg其实诞生的比canvas要早
- 所绘制的图形是矢量图，所以不会失真
- SVG 适用于矢量图，低数据量低绘制频率的场景，如图形、图表；
- 浏览器 js 配有相应的操作api，可以不再依赖其他的API或组件而直接绘图，相当于2D的API。
- canvas
- h5新提出来的内容
- 当作一个画布，绘制的是标量图，可以引入jpg/png等
- Canvas 适用于位图，高数据量高绘制频率（帧率）的场景，如动画、游戏；
- 2d上下文就是普通的canvas2d绘图，3d上下文就是调用webgl
- webgl
- WebGL 是以 OpenGL ES 2.0 为基础的一套 浏览器 3D图形API （HTML5）,目前最新版本是2.0，基于OpenGL ES 3.0规范实现
- WebGL 无论如何都需要一个显示对象来呈现，这个对象就是 Canvas，仅此而已，WebGL不对Canvas有任何附加的操作API， 那部分属于浏览器js支持的范畴。
- Three.js、Babylon.js、Blender4Web等是几种知名的 WebGL 开发框架，对 WebGL 基础操作做了大量的封装，可以拿来就用， 即使不了解 WebGL规范的细节。
-
svg和canvas的效率方面
- 渲染同一个对象,分辨率越大,canvas效率越低.
- 节点越多,svg效率越低
