虚拟dom对于前端工作者来说都很熟悉，而zrender可能相对没有那么熟悉。但是说到echarts应该都听说过，echarts的底层图形引擎，就是zrender。
图形引擎还有很多，比如pixijs、zrender、createjs等等，我在工作中接触到的引擎就是createjs和zrender，最近看了下zrender的源码，发现zrender的原理和虚拟dom有异曲同工之妙，在zrender中，每个图元对应一个js对象，这个js对象负责记录这个图元的图形数据信息，比如位置、大小、颜色等。当改变这个图形的图形信息时，zrender引擎会根据修改后的信息，重绘当前的画布，这个和虚拟dom的思路还挺像的，虚拟dom也是记录了它对应的dom元素，当虚拟dom发生改变时，就更新相应的dom。不一样的是，虚拟dom只是修改被修改的dom，而zrender是先清空画布，再根据图元对象重新绘制画布，但是因为canvas绘图底层是基于webgl，性能要高很多。不过如果图元过多，还是可能会造成卡顿。
虽然canvas也可以实现局部清除和绘制，但是如果多个图元有重叠，这个清除就会有问题。
综上所述，虚拟dom是利用了js的执行要快过dom渲染的优势。而zrender则是通过js对象，实现了对各个图元的管理，为图形编辑器打下了基础。
