如何为 Web 应用程序实现自动保存答案

【问题标题】：How to implement autosave for a web application如何为 Web 应用程序实现自动保存
【发布时间】：2021-03-17 14:16:33
【问题描述】：

我有一个网页，其中包含一个表格，您可以在其中编辑每个单元格的内容。该表的典型大小约为 12 列和 40 行。这个页面通常被教师用来在我们地区对成绩进行编码。但是我们地区有时连接不好，有时会发生这种情况，老师会丢失他们所做的编码（他们通常只在对所有内容进行编码后才保存）。

所以现在，我正在考虑实现自动保存功能。我认为我正在考虑的解决方案是直截了当的：每次编辑单元格然后失去焦点时，执行 ajax 请求来保存数据。至少我是这么想的。

我担心的是因为有很多人同时使用它，每次编辑，访问数据库，插入或更新，这不会太重吗？而且，我已经尝试了一下，当从一个单元格移动到另一个单元格时，UI 变得有点不稳定。我的主要问题基本上是，有没有一种模式或指导方针可以用来实现这一点？

【问题讨论】：

嘿@g_b 你能把你认为对这个问题很重要的东西放在bold中吗？前段时间我还问了一个关于 React 的基于性能的问题，它得到了很好的响应，可能是由于格式化。这是供您参考的链接 - stackoverflow.com/questions/61724883/…。
我建议您将编辑保存在客户端的 localStorage 中，并根据超时（例如，5 秒无编辑）或用户操作（例如，单击“保存”）批量推送更新
也许你需要了解一下redux.js.org。您可以存储表状态并在某个时候提交该数据。虽然不是这个领域的规范

标签： javascript c# asp.net-core design-patterns

【解决方案1】：

我需要有关您的 api 设计的更多详细信息，以帮助提出最佳解决方案，但这里有一些您可以考虑的高级方法

在每次单元格更新时，只更新 diff（退出的单元格）而不是整个数据集，以使 api 调用尽可能轻量级
研究使用 IndexedDB 或本地存储在浏览器更新单元格时将数据副本保存在浏览器中。如果连接丢失，您可以恢复用户的会话。

【讨论】：

【解决方案2】：

这里有几点我提到的你的问题，并尝试说出它的解决方案：

首先，您必须考虑并发性。如果您需要长时间向您的用户显示表格内容，可能会被其他用户同时更改内容，当前内容将过期！所以你可以保持你的表格内容不断更新！一种解决方案是在 DotNet 中使用 RowVersion 用于此目的（并发的乐观方法）。另一种解决方案是使用SingnalR 来保持表始终更新（我的意思是实时）。此外，在常规系统中根据用户请求进行更新和编辑没有严重问题，但在企业解决方案中，您可以扩展或扩展您的结构。

【讨论】：