rectangulos - deteccion de colisiones en javascript

Detección uniforme de colisiones de cuadrícula entre círculos en 2d

Question

Estoy trabajando en un juego de arcade 2d donde tengo 5 tipos de círculos con diferentes tamaños: el barco, los misiles y 3 tipos de monstruos.

Esto es lo que parece:

Actualmente estoy usando la detección de colisión de fuerza bruta donde controlo cada misil contra cada monstruo sin tener en cuenta la probabilidad de colisión. Lamentablemente, esto hace que el proceso REALMENTE lento.

Esta es mi clase de Grid, pero está incompleta. Te agradecería mucho tu ayuda.

 public class Grid {
int rows;
int cols;
double squareSize;
private ArrayList<Circle>[][] grid;
public Grid(int sceneWidth, int sceneHeight, int squareSize) {
this.squareSize = squareSize;
// Calculate how many rows and cols for the grid.
rows = (sceneHeight + squareSize) / squareSize;
cols = (sceneWidth + squareSize) / squareSize;
// Create grid
this.grid = (ArrayList[][]) new ArrayList[cols][rows]; //Generic array creation error workaround
}
The addObject method inside the Grid class.
public void addObject(Circle entity) {
// Adds entity to every cell that it''s overlapping with.
double topLeftX = Math.max(0, entity.getLayoutX() / squareSize);
double topLeftY = Math.max(0, entity.getLayoutY() / squareSize);
double bottomRightX = Math.min(cols - 1, entity.getLayoutX() + entity.getRadius() - 1) / squareSize;
double bottomRightY = Math.min(rows - 1, entity.getLayoutY() + entity.getRadius() - 1) / squareSize;
for (double x = topLeftX; x < bottomRightX; x++) {
for (double y = topLeftY; y < bottomRightY; y++) {
grid[(int) x][(int) y].add(entity); //Cast types to int to prevent loosy conversion type error.
}
}
}

Pero ahí es donde estoy en una pérdida completa. Ni siquiera estoy seguro de que el código fuente que proporcioné sea correcto. Por favor, hágame saber cómo hacer que la colisión basada en la red funcione. Leí básicamente todos los tutoriales que pude tener pero sin mucho efecto. Gracias.