在路径上设置描边和阴影导致平均操作急剧下降

【问题标题】：Setting stroke and shadow on path cause Dramatic drop in average operations在路径上设置描边和阴影导致平均操作急剧下降
【发布时间】：2014-03-01 19:09:12
【问题描述】：

我一直在使用 KineticJS 4.7 对路径的描边和阴影设置运行一些测试用例。他们可以在这里找到：http://jsperf.com/pathshadow 可以看出，在路径上设置描边和阴影会导致操作次数下降近 100%。我用 Chrome 32.0.1700 运行测试。有什么想法可以改善这些结果吗？谢谢

【问题讨论】：

与 kineticJS 5.0.1 的结果相同
那么不要使用阴影？这是一项昂贵的功能。

标签： performance html5-canvas kineticjs

【解决方案1】：

正如@Philipp 所说，阴影是一项昂贵的操作。

如果您需要移动或复制昂贵的阴影路径，您可以考虑将其转换为图像对象。

var pathImage=myPath.toImage();

var myPathImage=new Kinetic.Image({image:pathImage, ...});

这样后续的移动/复制并不昂贵，因为阴影保存在图像中。

【讨论】：

感谢您的回答，我不知道这是可能的。我选择为所有阴影制作一个 PNG，现在它非常酷。