javascript - How to detect collisions between fast moving objects -

generally detect collisions in canvas games use like:

function collides(a, b) {    return a.x < b.x + b.width &&      a.x + a.width > b.x &&      a.y < b.y + b.height &&      a.y + a.height > b.y; } 

but detects collisions if objects touching @ time frame processed. if have sprite speed (in pixels/frame) greater width of obstacle in path, pass through obstacle without collision being detected.

how go checking what's in between sprite , destination?

that's hard problem , high-quality solution box 2d library useful.

a quick , dirty solution (that gives false positives on diagonally moving objects) — check collision between bounding boxes cover position of object in current and previous frame.

instead of a.x use min(a.x, a.x - a.velocity_x), instead of a.x + a.width use max(a.x + a.width, a.x + a.width - a.velocity_x), etc.

if object moving fast small (a bullet), test collision between line (from origin origin + velocity) , boxes of other objects.