Vuex 存储我所有的产品信息和 API 请求查询

Question

这是一个 Vue/Vuex 效率/确认最佳实践问题。

我有一个 API 返回一个包含 50 种产品的分页数据集，其中我保存在 Vuex 商店中。

对于我的“显示所有产品”视图，我正在遍历 Vuex 商店。

对于我的个人产品路线，我有两种想法是直接从 Vuex 商店加载产品（这意味着不需要再次请求产品，因此速度更快。）还是只从我的API。

我想权衡的是，对 API 的初始请求需要响应的数据比用户最初在“显示所有产品”视图中看到的数据多，因此这似乎有点浪费。

对此有什么想法和意见吗？只是想和另一个人确认一下我的想法。

同样使用 Vuex，继续向 store 追加数据是否可行？例如，如果用户正在浏览更多产品，我应该将额外的数据从 API 附加回商店，还是只保留滚动的 50 条记录？

非常感谢！

菲尔

Answer 1

我真的不认为将所有数据都放在 vuex 中是一个好主意，我会更多地使用 Vuex 来管理和维护购物车或其他一些状态......

如果您的产品数据库索引良好，并且您只获得一页产品，那么您的 REST 调用应该足够快。 您可能应该投入更多时间来改进您的数据库和 Db - 查询。 这将进一步提高您的 Rest 调用的响应能力...

您还应该认为，如果不细化搜索，大多数用户不会超过产品的第 3 或第 4 页，因此良好的搜索更为重要。

如果你使用 vuex 的问题是，如果你存储大量数据，它真的会变慢（我已经做过），如果你使用突变和 getter，它会变得更慢。

如果您真的想将产品存储在客户端上，因为您有可能连接不良的用户，那么我建议您使用其他一些离线存储功能，例如 IndexedDB（不要使用 LocalStorage 或 WebSQL它们是旧的和/或特定于供应商的）...

我希望这可以帮助您做出决定。