Javascript - canvas drawImage

Question

表现更好：

1. drawImage（img，...）其中img是一个Image（）或img是一个画布？

2. 使用缩放（最近邻居）绘制drawImage 2x，或清除其他画布，在不缩放的情况下绘制2x，然后使用缩放绘制结果1x？

3. 舍入正在绘制的图像的px坐标，宽度，高度，或将它们保留为浮点？

Answer 1

为什么不做一些jsPerfs并在此向我们报告您的结果！

在此之前，这里有一些高度投机和轶事的想法：

（＃1）我曾经推荐过drawImage（图片......但是我看到了一个jsPerf比较drawImage（带有drawImage的图像）（当使用GPU加速时画布非常接近（不记得在哪里，但它是一个响应）某人在我的SO答案中发表的评论。）可能是因为GPU可以快速地将画布上下文.getImageData快速点亮图像数据。

（＃2）我不知道... jsPerf增量缩放与imageSmoothingEnabled == false（最近邻居）。

（＃3）无论如何，浏览器转换为浮动，但Mozilla性能文章建议“避免使用浮点坐标并使用整数。”。当然，预舍入需要一些cpu cyles，因此需要使用实际设计特定代码的jsPerf来确定哪个在特定情况下提供更多性能。