getImageData()性能

Question

我只需要在画布上得到一个像素的状态，但是我注意到它的速度非常慢。

这是我的JS

var state = ctx.getImageData(x,y,1,1).data;
state = 'rgba(' + state[0] + ',' + state[1] + ',' + state[2] + ',' + state[3] + ')';
return state;

除了获取画布上单个像素的状态之外，还有其他选择吗？

Answer 1

那么这个神奇的像素是如何变化的呢？

由于您正在进行编程，您应该能够注意到会改变该像素的活动。

例如，如果您(或用户)在该像素上移动某物，从而改变该像素，则您将能够预测该像素上任何对象的路径(或注意到用户正在该像素上移动某物)。

无论如何，如果.getImageData正在拖慢您的性能，我的建议是设置一个.requestAnimationFrame循环，并以更大的间隔检查该像素上的变化。如果你每隔1/60秒检查一次，也许每隔5/60秒就检查一次。