使用 Redux 的 PouchDB CRUD 模式

Question

我在 React 中编写了一个 Electron 应用程序，它使用与远程 CouchDB 本地同步的 PouchDB。我使用 Redux 进行状态管理，想了解 CRUD 的最佳实践是什么？

我有一个要求（这就是为什么我不确定要使用的最佳模式的原因）是当其他人远程更改某些内容时应用程序需要更新。

考虑到这一点，到目前为止我已经尝试了 2 种模式。

1. 使用DB.changes() 收听changes，它将获取每次更改的所有数据（受中间件限制，但可以使用redux-saga）。这种方法导致用户交互和加载到应用程序中的新数据之间的周转时间明显延长，因为用户会更新，然后显示“更新成功”消息，最终显示“数据更新”消息。当然，在这些点中的每一个点都会发送一些动作，这会影响 UI 渲染并增加糟糕的用户体验。 DB.changes() 方法可以返回我没有在这个方法中指定的更改文档

   DBChanges = DBChanges.changes({
     since: 'now',
     live: true,
     include_docs: false
   }).on('change', change => {
     // handle change
     fetchAllDocs().then(setAllDocsInApplication)
   });
   

2. 收听changes 和DB.changes()，包括更改后的文档。这些更改可以是远程的，也可以来自应用程序内的用户交互。在每次更改时，查看返回的文档并根据更改更改应用程序状态。这使得整个周期时间更短，但是当我改变获取的数据时，这感觉像是一个糟糕的模式。

   DBChanges = DBChanges.changes({
     since: 'now',
     live: true,
     include_docs: true
   }).on('change', change => {
     // handle change
     if(change.deleted)
       handleRemove(change.doc)
     if(change..doc._rev.split("-")[0] === "1")
       handleNewDoc(change.doc)
     handleUpdateDoc(change.doc)
   });
   

那么我想知道的是，对于 CRUD 来说，实时更新的最佳模式是什么？

Answer 1

我认为答案归结为：

您是否需要针对每次更改从头开始从文档构建整个应用程序状态 - 或者您能否确定传入更改所需的操作类型？

考虑用户与应用交互时的数据流。您可能像这样初始化应用程序：

allDocs → derive initial AppState → render in React

那么会发生什么，例如，如果用户创建了一个新项目，你呢？

putDoc → allDocs → derive entire AppState → render in React

或者你是：

putDoc → trigger Redux action that modifies AppState → render in React

如果您选择后者（我假设是这样），您的更改处理程序看起来基本相同。有传入的更改，问题是：你能从传入的更改中确定所需的 Redux 操作吗？更改为您提供：

• 文档类型（希望您拥有此属性）
• 不管它是否被删除

所以，当你的处理程序发生变化时，你会这样做：

changeHandler → trigger Redux action that modifies AppState → render in React

这是选项 2。

选项 1 如下所示：

changeHandler → allDocs → derive initial AppState → render in React

选项 1 有一个主要缺点：如果您的应用程序离线数周并且远程数据库发生大量更改（例如，因为 Electron 应用程序在另一台计算机上运行），重新在线将导致 A正在下载大量更改，每一项更改都会触发您的 fetchAllDocs() 呼叫。

但是当我改变获取的数据时，这感觉像是一个糟糕的模式。

为什么？您不会改变获取的数据（我假设您的意思是最初的 allDocs）。最初的 allDocs 仅有助于派生 AppState，您在 Redux 和 React 中使用。您可能不会将 allDocs 中的内容用作您的 AppState，是吗？