Javascript 在鼠标上方查找点时出现性能问题

我正在尝试制作一个动画，在画布上和鼠标上有很多点，它们被隐藏，在超时后再次显示。 鼠标悬停效果不应仅发生在鼠标所在的确切位置，而应发生在例如20x20像素的框中

在我的原型中，我有这些循环

for (var i = -10; i <= 10; i++) {
  for (var j = -10; j <= 10; j++) {
            var imagedata = c.getImageData(x+i, y+j, 1, 1).data;
    if (imagedata[0] == 99) {
      fadeInRectangle(c, x+i,y+j);
    }
  }
}

---

for（var i=-10；i我要做的是创建一个点对象数组，每个点对象存储点的
x
和
y
位置，以及
visible
属性（如
{x:10，y:40，visible:true}
）。每当鼠标移动时，循环遍历每个对象并检查鼠标与点之间的距离。如果发现点在范围内，则将其属性
可见
设置为
假
。在该部分之后，仍然在
onmousemove
内，清除画布并重新绘制每个点，跳过那些
可见：假
的点r几秒钟后，将
可见
设置回
真实