多个轴对齐矩形之间的简单碰撞响应实现

Question

我需要在矩形框中约束的许多不同轴对齐矩形之间实现简单形式的碰撞检测和响应。

对于每个矩形，我正在检查所有碰撞墙壁和所有其他矩形的碰撞（此时我不需要任何优化）：

var l = boxes.length;
for (var i = 0; i < l; i++) {
  var a = boxes[i];
  checkWalls(a, cw, ch);
  for (var j = 0; j < l; j++) {
    var b = boxes[j];
    if (i != j) {
      checkCollision(a, b);
    }
  }
}

在镜像碰撞角度后，两个矩形a和b之间的恢复计算如下（质量对我的问题无关紧要）：

vxTotal = aVel.x - bVel.x;    
aVel.x = bVel.x;
bVel.x = vxTotal + aVel.x;
aPos.x += aVel.x;
bPos.x += bVel.x;

......并且在墙上弹跳的方式基本相同：

a.vx *= -1;
a.vy *= -1;
a.x += a.vx;
a.y += a.vy;

我的实施尝试有时会失败，例如当一个矩形撞击墙壁后立即撞击附近的另一个矩形时。奇怪的是，当我仅在一个方向上计算速度时也会发生这种情况（见下图）：

箱箱和箱壁碰撞检测工作正常。我想，我错过了一个完整的响应计算，同时考虑墙和矩形，但这只是我的猜测。

哪种方法可以计算不同矩形和周围墙壁之间的正确碰撞响应，并避免上述的竞争问题？

这是我的测试小提琴：https://jsfiddle.net/u56oh376/

修改

如上所述，上述情况也会在一些运行时间后以非常低的速度发生，并且如前所述仅仅设置y轴速度。所以我认为在我的角度或旋转计算中某处会有误差累积。 这是我如何计算两个a和b矩形之间的角度：

var dx = b.x - a.x,
    dy = b.y - a.y,
    angle = Math.atan2(dy, dx),
    sin = Math.sin(angle),
    cos = Math.cos(angle);

这是我正在使用的镜像功能：

function rotate(x, y, sin, cos, reverse) {
  return {
    x: (reverse) ? (x * cos + y * sin) : (x * cos - y * sin),
    y: (reverse) ? (y * cos - x * sin) : (y * cos + x * sin)
  };
}