首页 > 解决方案 > 使用 Firestore 实时快照侦听器,arrayUnion 和 arrayRemove 是否会触发从服务器重新加载整个阵列?

问题描述

使用 Firestore、React Native、RN Firebase、TypeScript。

我正在考虑使用数组存储来自用户的 Uid 的书签的利弊。

我什至可以使用它为用户的书签页面生成内容列表,按最新排序,但我觉得我宁愿将带有标题和 ImageURL 的数据复制到一个单独的集合中以用于特定用途。

它是一个内容应用程序,有点类似于博客。主要用途是在主页上的帖子列表以及帖子页面中显示可点击的书签图标。我预计收藏的书签最多可达 3000 条,而大多数都在 100 条以下。我们可以想象,当用户疯狂阅读时,他可以连续添加多达 10 个书签。

我可能会像这样收听包含数组的用户文档(或将其分成另一个集合以避免膨胀用户文档):

import React, { useEffect } from 'react';
import firestore from '@react-native-firebase/firestore';

function User({ userId }) {
  useEffect(() => {
    const subscriber = firestore()
      .collection('Users')
      .doc(userId)
      .onSnapshot(documentSnapshot => {
        console.log('User data: ', documentSnapshot.data());
      });

    // Stop listening for updates when no longer required
    return () => subscriber();
  }, [userId]);
}

然后我可以单击主页列表或页面中的书签图标。它会触发这样的动作:

// Atomically add a new bookmark to the "bookmarks" array field.
var arrUnion = bookmarks.update({
  bookmarks: admin.firestore.FieldValue.arrayUnion('ItemId_127892')
});
// Atomically remove a bookmark from the "bookmarks" array field.
var arrRm = bookmarks.update({
  bookmarks: admin.firestore.FieldValue.arrayRemove('ItemId_127892')
});

但是,如果用户有一个包含 100 或 1000 个项目的数组,我宁愿避免这种情况,因为他每次添加书签时都会从数据库中重新加载整个数组。这肯定会扼杀他的数据计划。

另一点是我需要立即在 UI 上看到更改。所以我还需要在侦听器的缓存中快速更新。

那么,关于与缓存和服务器的数据交换,它是如何详细工作的?

标签: typescriptfirebasegoogle-cloud-firestorereact-native-firebase

解决方案


但是,如果用户有一个包含 100 或 1000 个项目的数组,我宁愿避免这种情况,因为他每次添加书签时都会从数据库中重新加载整个数组。这肯定会扼杀他的数据计划。

不一定:如果启用了本地缓存(Android 和 iOS 上的默认设置),第二次需要文档时,它实际上将来自本地缓存,而不是从服务器重新传输相同的数据。


推荐阅读