前端为什么需要Canvas?

DOM/CSS排版复杂,渲染、合成耗时,尤其在做动画需要不断重绘操作的时候。Canvas是H5的画布元素,即一个DOM元素。通过脚本控制逻辑给画布上增加文字与图像,而浏览器只需要绘制一次形成一幅图。

前端为什么需要Canvas?

只用一个 Canvas DOM 元素,降低 DOM 数量与渲染的复杂度,可以将原来 CPU 密集型变成 GPU 操作。

1.绝大多数针对 Canvas 是用硬件 GPU 加速渲染。
2.GPU 的 ALU(计算单元) 比 CPU 要多很多;
3.而控制运算(逻辑)则可以用 JavaScript 在 CPU 里做,甚至还可以用 WebWorker 多线程处理 CPU 密集型的操作;
4.从而达到充分利用硬件资源的能力。
5.Canvas画布无论是 JavaScript & H5,还是native都有类似的 API。因此我可以把浏览器Canvas接口的反射到用native画布上,以此提高性能。

相关阅读