通过透明度提高画布性能答案

【问题标题】：Improving Canvas Performance with Transparency通过透明度提高画布性能
【发布时间】：2017-01-04 20:32:38
【问题描述】：

绘制包含透明度的图像很慢。

有什么方法可以直接丢弃包含透明度的像素？

当我绘制不包含任何透明像素的图像时，它真的很快。

【问题讨论】：

没有提供足够的信息。向我们展示您的代码，否则我们将无法为您提供帮助。
@TiagoMarinho 我会，但在十几个文件中有很多。缺少什么样的信息（/代码）？（我的意思是，我们知道如何将图像绘制到画布上。）
您应该提供可以重现您的问题的最少代码量。如果您的有问题的代码位于一个巨大的项目中，最好尝试将其与其他代码隔离开来看看会发生什么，并且当您在那里时，将隔离的内容粘贴到您的问题中。 ;)
我不是这么说，因为我很懒惰，但是从我的角度来看，这真的太难找出问题所在了，我真的怀疑它来自图像的alpha 频道。
@TiagoMarinho 啊，明白了！将使用一些代码更新它并回复您。 :)

【解决方案1】：

是的，您可以获得不支持 alpha 的上下文。缓慢可能来自背景合成浏览器必须与元素有关，并且每次绘制某些东西。方法如下（注意最后的选项）

var context = canvas.getContext('2d', {alpha:false});

您仍然可以在画布内本地合成透明度，但背景将始终保持不透明。我认为大多数浏览器都支持它，但我不会为 ie11 或更早版本保留我的帽子。

【讨论】：