使用Redux的PouchDB CRUD模式

Question

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

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

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

1. 使用DB.changes()收听changes，它将在每次更改时获取所有数据（使用中间件限制，但可以使用redux-saga处理）。这种方法导致用户交互和加载到应用程序中的新数据之间的交互时间明显变长，因为用户将进行更新，然后显示“ Update success”（更新成功）消息，最后显示“ Data Updated”（数据更新）消息。当然，在这些位置上的每一个都会分派动作，这会影响UI呈现并增加不良的用户体验。 DB.changes()方法可以返回我在此方法中未指定的更改文档

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

2. 使用DB.changes()（包括已更改的文档）收听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，对吗？