ตั้งค่าคุณภาพการ resampling ด้วย ctx.imageSmoothingQuality = "low|medium|high"
เทคนิคลดขนาดภาพแบบขั้นตอน (step-down scaling) เพื่อคุณภาพดีกว่า:
// off-screen canvas
var c = document.createElement('canvas'), ocx = c.getContext('2d');
c.width = img.width * 0.5;
c.height = img.height * 0.5;
ocx.drawImage(img, 0, 0, c.width, c.height);
// ลดอีกครั้ง
ocx.drawImage(c, 0, 0, c.width * 0.5, c.height * 0.5);
ลดขนาดทีละนิด (เช่น 0.5x ต่อครั้ง) ให้ผลลัพธ์เรียบกว่าลดครั้งเดียว