canvas绘制多个相同图形性能

用canvas绘制一个上面的图形 很简单，中间一个矩形，左右两个圆，再绘制中间的文字。

绘制一个很简单，但是如果要绘制20个，甚至是200个呢。

当然可以使用循环20次或者200次每次重复类似绘制1个图形的步骤，先rect矩形，然后arc 两次arc，然后再fillText。

结果当然是可以绘制出来的，不尽人意的是当绘制200个或者很多个的时候会出现明显的卡顿(并不是单纯渲染，图形会运动)。

这时就很想要个api能保存之前绘制的图形，缓存起来，循环渲染改变的只是图形的位置，translate等api可以满足，奈何没有类似的api。

原生的canvas处理类似的问题有一个解决方案是离屏canvas，当然能使用离屏canvas是因为drawImage可以加载canvas，同样还有image，实现的过程就是先创建一个canvas绘制一个图形，然后把canvas保存下来，再利用drawImage加载canvas，如果改变图形的位移使用translate等api，性能会比循环调用api好太多。

因为小程序drawImage不支持加载canvas对象，更别提离屏canvas了。所以如果想绘制多个相同图形，只能想办法加载图片了。

即，先绘制一个图形，然后把图片保存起来，接下来drawImage加载图片就行，理论上也可以达到同样的效果。

但是会有不足，因为需要先调用api把绘制的图形保存起来，然后才能调用，不言而喻，会停顿一下需要获取到保存的图片路径然后才能绘制。

不知道有没有更好的方法绘制多个相同图形