Javascript 加载到节点画布模块的JPG文件在操作和导出后会丢失质量

我正在使用节点画布实现

我用它把一个jpg导出的时事通讯设计切成几片，并生成一个基于图像的HTML模板，该模板对电子邮件友好。 基本上，根据我的电子邮件需求，它只是以550px左右的速度从源代码中分割出来的

问题是，当我加载源jpg文件时，我看到导出的切片中有一些丢失。 以下是一个例子：

如您所见，右侧的版本（源代码-jpg）比节点画布处理的版本更清晰，质量更好

我已经在所有toDataUrl调用中以完全质量使用了export jpg，而不是规范中的0.92。我正在使用node canvas提供的loadImage函数，是否可能在那里失去质量

this.writeImage（canvas.toDataURL（'image/jpeg'，1.0），i）

此外，我已经在上下文中增强了质量设置：

    ctx.patternQuality = 'best';
    ctx.quality = 'best';
    ctx.antialias = 'subpixel';
    ctx.imageSmoothingEnabled = false

我在想也许我没有正确使用上面的设置？或者，错过了一个

其中一个想法是将源文件放大2倍，然后在处理时调整大小，以保持原始jpeg的质量

我的问题是，在加工过程中，如何防止质量损失？在应用所有步骤的过程结束时获得较低质量的图像是没有意义的，但是

多谢各位，
德拉戈斯

稍后编辑：

实际上我问错了，我使用的源代码实际上是PNG，正是因为我想在我的jpeg导出中获得高质量。
导出显然不如原始PNG好，但我获得了JPG格式的源代码，与我可能使用的潜在JPG相比仍然有损失，但从技术上讲，我是从PNG中删除的。
这不是一个解决方案，也不清楚降级的来源是什么。JPEG使用离散小波变换进行压缩。小波覆盖8×8像素的区域。您不能只在任意的x，y（左上）处剪切JPG，因为它会改变小波样本的位置，从而无法再现原始小波。您必须以8的倍数切割（左上）才能有机会保持原始质量。另外，看起来您正在使用一种模式来渲染图像，请不要使用
ctx.drawImage
来渲染图像，谢谢您的回答！我肯定是在使用ctx.drawImage进行裁剪。以8px倍数切割可能会削弱我的业务用例，但是，根据您所说的：如果我不使用drawImage进行切割，只准备一张空画布，然后，而不是使用drawImage进行切割和裁剪，该怎么办，我只是简单地将整个源代码放在画布上，并使用翻译让我越过我想看到的源代码区域。如果你愿意的话，有点像模版。这意味着当我运行toDataUrl时，整个图像仍然存在，但我只看到了我想看到的部分？
toDataUrl
在画布上执行，与上下文无关，因此不受任何转换的影响。我意识到我问的问题有点错，我添加了更多信息，我能安全地避免8乘8的事情吗？你说，我的第二个通过出口种植的想法也行不通？这不是一个解决方案，也不清楚退化的根源是什么。JPEG使用离散小波变换进行压缩。小波覆盖8×8像素的区域。您不能只在任意的x，y（左上）处剪切JPG，因为它会改变小波样本的位置，从而无法再现原始小波。您必须以8的倍数切割（左上）才能有机会保持原始质量。另外，看起来您正在使用一种模式来渲染图像，请不要使用
ctx.drawImage
来渲染图像，谢谢您的回答！我肯定是在使用ctx.drawImage进行裁剪。以8px倍数切割可能会削弱我的业务用例，但是，根据您所说的：如果我不使用drawImage进行切割，只准备一张空画布，然后，而不是使用drawImage进行切割和裁剪，该怎么办，我只是简单地将整个源代码放在画布上，并使用翻译让我越过我想看到的源代码区域。如果你愿意的话，有点像模版。这意味着当我运行toDataUrl时，整个图像仍然存在，但我只看到了我想看到的部分？
toDataUrl
在画布上执行，与上下文无关，因此不受任何转换的影响。我意识到我问的问题有点错，我添加了更多信息，我能安全地避免8乘8的事情吗？你说，我的第二个通过出口种植的想法也行不通？