做了个canvas文字测试，看看效果如何。
由于代码中包含了图片的base64码所以放在最后了，测试结果如下：

//代码内容：一张写了5个蓝色喵的图片和5个无任何样式的喵字各绘制十万次
123.8950000006298	//图片
153.4990000000107	//文字
91.63100000114355	//图片
150.8400000002439	//文字
88.55799999946612	//图片
150.93399999932444	//文字
88.62000000044645	//图片
150.16500000092492	//文字
87.77499999996508	//图片
149.93399999912072	//文字
87.90600000065751	//图片
149.8909999991156	//文字
87.98000000024331 	//图片
65.1319999997213 	//文字

为了尽量准确一点，避免浏览器热身等原因我把测试放在循环里进行多次测试。
可见文字渲染确实是效率比较低的，不过这里还不是太明显。
这里的文字渲染还是无任何样式的，平常应用的时候不可能就这么用没样式的字，所以我还要再来一个有样式文字渲染测试。

结果：

//内容，绘制同上的图片和样式和图片里文字一样的5个喵各十万次
122.4900000015623	//图片
444.2899999994552	//文字
92.87199999744189	//图片
433.98700000034296	//文字
89.11799999987124	//图片
434.4539999983681	//文字
89.41499999855296	//图片
436.07799999881536	//文字
88.66099999795551	//图片
435.41299999924377	//文字
89.72800000265124	//图片
433.81500000032247	//文字
88.95900000061374	//图片
311.4950000017416 	//文字

给字加了样式以后差距就更明显了，主要还是消耗在了样式字符串的解析上，不过这里还是只设置了字体和大小还有颜色，设置更多的样式的话还会更慢（尤其是阴影，描边似乎第二慢）

总结：一段文字不怎么会变的话还是先渲染到一个小canvas然后就可以轻松的复用了，效率比每一帧都渲染一遍要高很多

原始代码如下：