React网站使用什么技术来更新静态数据？

Question

我是一名拥有 40 年桌面开发经验的桌面开发人员。我有一位 Web 开发人员使用 React 来开发销售点网站。该网站主要是前端。我开发了一个 API，网站用它来提取数据并将其发布到我的桌面应用程序的数据库中。因此，基本上，API 会提供特定于用户的菜单，网站允许用户进行销售，网站则通过将购物车传递给 API 来发布销售。为了使用户特定的菜单更小（意味着更少的数据和/或网络流量），网站需要每天一次从 API 中提取包含产品描述等的主菜单（当网站上的用户很少时，可能是凌晨 1 点），然后仅当用户登录时，会发送 SKU 和价格（特定于用户）等信息。调用 API 来获取该用户的特定菜单。网站如何定期（每天、每小时或仅在有更新可用时）更新我的主菜单等内容？我相信我们已经决定使用 Redux 在本地存储数据。

好的，您要求了解更多细节。网站每天调用一次API来拉取主菜单。主菜单包含约 1000 个商品的 sku 和商品描述（约 30 个字符）。该数据存储在本地。我这样做是为了当用户登录并且网站调用 API 为用户获取自定义菜单时，我不会发送项目描述，从而减少数据量。由于用户特定菜单仅包含sku，因此网站从主菜单中获取相应的项目描述。从理论上讲，这对于老桌面应用程序开发人员来说是有意义的，因为我们只是通过网络传递更少的数据。我的问题是，假设我这样做，网站如何定期更新主菜单，或者如何让网站知道主菜单更新可用并且应该应用。

Answer 1

对于数据获取部分，我建议使用tanstack query，一个支持定期或随意重新加载数据的库。它支持的一些功能是：

• 一段时间后检索数据
• 在用户聚焦您的选项卡后检索数据
• 手动将查询标记为无效以立即再次获取它
• 在 wifi 连接丢失然后重新恢复后检测网络变化并重新加载数据

您可能需要确认一些使网页与桌面应用程序不同的细节：

• 您无法使用后台服务来获取数据（好吧，您可以，但对于大多数网站来说这并不是可取的）。这意味着每次数据检索都必须在客户端打开页面时完成
• 您无法写入持久文件。但是，您可以使用 localStorage 来存储您需要的任何持久数据（但如果用户在 7 天内没有访问您的页面，safari 会删除它）
• 与前文相关，无论如何，对于网站来说，最好的方法通常是将数据保留在内存中，这就是引入 Redux 等库的地方。关闭浏览器选项卡后，Redux 数据将被删除，但您应该在再次加载页面后再次获取它