Javascript 加载时，image.src到大图像冻结

我一直读到图像已经异步加载，或者使用

onload

（这并不能解决问题）。加载大型图像时，特别是从

canvas.toDataURL（）

加载图像时，整个页面将冻结

我具体做的是在一个隐藏的画布中预渲染一个程序生成的地图（游戏），然后将数据加载到一个图像中以更快地绘制。实际的问题是设置src，即使我只是

img.src=img.src

再次调用加载，也会发生这种情况

---

有没有办法让大图像随着时间推移而不是一次加载，从而造成如此巨大的破坏？

这个问题已经问了6年了，但我偶然发现了它，其他人也可能会问。我猜您首先通过分配

img.src=“image.png”

加载图像，然后在其

onload

中进行处理，然后通过执行

img.src=canvas.toDataURL（）

将图像的数据替换为处理后的数据，然后再次启动

onload

，并以无休止的递归方式继续执行。

code？它们通常随时间加载，除非您告诉它们不要加载，这就是异步的含义。实际上，这可能是因为

toDataUrl（）

的原因；尝试使用BitmapData或toBlob函数/事物来操作它，因为它们不应该涉及将整个图像转换为Base64。@cactus1我已经尝试了

canvas.toDataURL（“image/bmp”）

，尽管它似乎没有任何效果，甚至没有稍微快一点；我会去看看这个网站（）和（）。对不起，我略过了你的问题，没有注意到你在做游戏；你不需要将图像转换成文件，如果你想提高性能，基本上只使用画布绘制操作。不幸的是，从缓冲区中提取图像（2x）和从图像中提取图像数据（许多x）都比从图像中提取图像慢得多，这就是我使用图像的原因。我更愿意使用imageData，只要它不是那么慢。嗯。。将两个画布堆叠在彼此的顶部，并将预渲染画布与顶部画布一起隐藏，直到完成渲染为止，怎么样？另外，您需要多少speedwise？你能摆脱drawImage 2倍的减速吗？对不起，我帮不上忙。