应用错误收集

我已经阅读了一些类似的问题和答案，但没有一个完全解决我的问题。

以下是我的情景： 我有类似于tinyMCE（虽然是家庭酿造版）的编辑器。它允许用户输入一些文本，一个或两个图像等。我有代码将项目放在那里并将它们实时渲染成一个较小的div（基本上是一个缩略图）。

这就是我想做的事 最终，用户可能想在其他地方使用他们的“页面”，所以我想让他们去屏幕，查看每个页面的缩略图，然后选择一个。

以下是问题 显然，我可以使用相同的缩略图代码来渲染每个页面缩略图。但是，它可能是带宽密集型的（每个页面可能有多个图像，更不用说计算必须多次执行 - 我们在预览页面上可能会说40到50个缩略图。）

所以，我想尝试使用缩略图div，并以某种方式创建一个png或jpg，当他们在编辑器中保存页面时（所以页面的代码，也是缩略图），并将其推送到我的PHP脚本将图像保存到服务器。

我的第一个想法是，也许画布可以做到这一点，但是存在将文本和图像首先翻译到画布上的问题，这可能是也可能是不可能的。

就是这样。我对任何和所有选项感兴趣，包括商业图书馆（如果有的话）会这样做 - 唯一的事情是，希望它是在javascript中。