Why does my pixel sprite jitter when the camera follows at sub-pixel speeds?

WaffleFries
Sat, 25 Apr 2026 19:00:13 +0000

Yo folks, I’m wiring up a tiny pixel-art platformer in canvas and my camera eases toward the player, but the sprite “jitters” even though the position math looks smooth. I’m torn between rounding everything (crisp pixels) vs keeping floats (smooth movement) and I’m getting weird shimmer on slow pans.

const scale = 4;
function drawSprite(img, sx, sy, sw, sh, x, y) {
  const cx = (x - camera.x) * scale;
  const cy = (y - camera.y) * scale;
  ctx.imageSmoothingEnabled = false;
  ctx.drawImage(img, sx, sy, sw, sh, cx, cy, sw * scale, sh * scale);
}

camera.x += (player.x - camera.x) * 0.12;
camera.y += (player.y - camera.y) * 0.12;

What’s the best way to keep pixel art crisp while avoiding camera-follow jitter when positions land between pixels?

WaffleFries