Javascript-canvas drawImage

Question

性能是否更好：

1. drawImage（img，...）其中img是Image（）或img是畫布？

2. drawImage 2x具有縮放比例（最近鄰居），或清除其他畫布，在不縮放的情況下向其繪制2x，然后以縮放比例繪制結果1x？

3. 舍入要繪制的圖像的px坐標，寬度，高度，還是將其保留為浮點數？

Answer 1

為什么不做一些jsPerfs並在這里向我們報告您的結果！

在此之前，這里有一些高度投機和軼事的想法：

（＃1）我曾經建議使用drawImage（image ...），但是我看到一個jsPerf，將drawImage（image和drawImage（canvas）在使用GPU加速時非常接近（不記得在哪里，但這是某人的回應評論）在我的一個SO答案中）。可能是因為GPU可以對畫布context.getImageData進行刷新的速度盡可能快，它可以對Images數據進行刷新。

（＃2）我不知道...具有增量縮放功能的jsPerf vs imageSmoothingEnabled == false（最近鄰居）。

（＃3）瀏覽器仍然強制轉換為浮點數，但是Mozilla的性能文章建議“避免浮點坐標，而改用整數”。 當然，四舍五入需要一些cpu循環，因此需要使用實際設計特定代碼的jsPerf來確定在特定情況下哪種代碼性能更高。