将大量数据从Web服务器传输到客户端

Question

我正在开始一个新项目,它将使用HTML5画布渲染复杂的图形.

目前,我们有一个Windows Forms实现,我们希望将其迁移到Web.因此,布局,绘图对象和所有绘图元数据都是在C#中生成的.我们只需要实现绘图,我们将使用HTML5 canvas.

服务器端将是ASP MVC.它将计算绘图模型,并将其发送给客户端.然后客户端将使用画布来表示数据.

问题是绘图模型有时可能很大.也许10Mb-50Mb的元数据.将所有绘图数据从服务器发送到客户端的最佳方法是什么？

将模型用于页面中的脚本,该脚本在JavaScript中创建绘图对象

这将是标准方式.我将使用C#中的绘图对象生成一个模型,然后我将这些对象转换为JavaScript.

• PROS:易于实施
• 缺点:页面很重.

从返回绘图数据的控制器返回JsonResult

例如,我可以使用jQuery来获取它.此选项失败,因为我到达了maxJsonLength属性.我知道它可以在web.config中更改,但它似乎不是一个好主意.3.

• PROS:易于实现,可以使用ajax从服务器加载绘图对象并向用户报告进度.
• 缺点:改变Web.config中的maxJsonLength属性似乎不太好.

使用服务器中的绘图数据生成临时脚本文件,并将其包含在客户端页面中

服务器将在JS脚本文件中生成绘图数据.然后,服务器将此页面作为JavaScript包含在客户端页面中,因此绘图数据将加载到客户端中.这个负载也可以使用ajax完成.

• PROS:就像下载文件一样,如果它非常大,那就不会有问题了.
• 缺点:更难实施.需要管理临时文件,我们需要知道文件何时被传输然后删除它.

其他选择

任何其他选项都将受到欢迎,因为我不是HTML编程方面的专家.

Answer 1

将繁重的部分（子页面上的脚本和数据）放在轻量级页面的 iframe 中，以便可以异步加载繁重的内容。这具有第一个页面脚本选项的易于实现的优点，同时获得了第三个加载为单独脚本文件选项的优点（并且没有临时文件管理的缺点）。

当 iframe 加载时，您可以显示加载图像，以便用户知道发生了什么。