Javascript 在HTML5画布上绘图的最佳实践、技巧和窍门是什么

我试图在HTML5画布上绘制大图像（5000*5000像素）。 这样做的最佳实践是什么

• 我应该使用一个画布还是多个画布（瓷砖方式）
• 我应该如何使用drawImage（）或putImageData（）
• 在这种情况下，性能和内存使用情况如何

---

你们能推荐这方面的最佳读物并分享你们的个人经验吗？

以下是我目前所知道的：

->非常适合你的速度

->即使调整了大小，图像质量也非常好

->如果您计划使用putImageData（）

作为一名HTML5游戏开发人员，我的经验是这两种做法非常好，我都使用它们

（我不知道它是否相关，但可能会派上用场，学会如何正确操作真是太好了）

---

还有,

这取决于你做这件事的目的，但如果你打算在5000px5000px的图像上滚动，我肯定会把它分成几个部分或平铺，然后使用

drawImage

只绘制用户将看到的部分

对于绘制大型图像，您将看到使用

putImageData

的性能下降，这是

drawImage

的目的

putImageData

在处理粒子等时非常出色。基本上，当您在屏幕上绘制大量小块时，您可以使用

putImageData

轻松绘制100000个对象

如果您只绘制用户可以看到的部分，那么性能和内存使用应该不会有问题，即使是完整的5000x5000也不应该是一个太大的问题。您所做的事情并不少见，大多数浏览器都应该能够处理它

---

该示例使用了大量分片，甚至实现了碰撞和寻路，运行良好。如果我只画一张大地图，如果我没记错的话，大概是10000x1000（每个图块是64x64）

画布不需要双缓冲。如果你查看了你链接的那篇文章，这篇文章就会在评论中被揭穿。其他的建议也不错，我的错。可能是错误的链接！不过，读起来很有趣：