When drawing an image with rotation on a JS canvas the image is blurring. See attached images.

Blurred, with rotation:

No blur, not rotated:

I have set imageSmoothingEnabled to false and image-rendering to pixelated.

Render code:

fg.save();
fg.translate(gun.x - gun.frame.w / 2, gun.y - gun.frame.h / 2);
fg.rotate(gun.a);
if(mouse.x < (player.x + player.width / 2)) {
    fg.scale(1, -1);
}
fg.drawImage(spriteSheet, gun.frame.x, gun.frame.y, gun.frame.w, gun.frame.h, 0, 0, gun.frame.w, gun.frame.h);
fg.restore();

Please no answers saying it isn't possible. It would be much more helpful having an alternative rendering method suggested.