JS Canvas旋转绘制像素图像时模糊问题的替代渲染方案求助

我在用JS Canvas绘制带旋转效果的像素风格图像时，遇到了严重的模糊问题，给大家看看对比效果：

• 旋转后的模糊效果：[旋转后模糊的像素图像]
• 未旋转的清晰效果：[无旋转的清晰像素图像]

我已经尝试设置imageSmoothingEnabled为false，也给Canvas加上了image-rendering: pixelated的样式，但还是没能解决模糊问题。

下面是我的渲染代码：

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();

特别提示：请不要回复我说这个问题无法解决，如果能给我推荐一些可行的替代渲染方法，对我来说会有非常大的帮助！

备注：内容来源于stack exchange，提问作者user29574732