如何在Firestore中将文档离线阅读并（在线和离线）写？

Question

最近，我使用Cloud Firestore和React Native创建了一个简单的聊天应用程序。 他们的离线和在线同步是一个很好的功能。

但是，在加载（读取文档）上花费了大量时间。 尽管我为每个用户（10个用户）分派了10个文档，但是加载消息仍然很慢，但是在缓慢的Internet连接中，加载消息最多需要10秒钟，这不是一个很好的体验。

在这里，当我启用离线模式时，它加载消息的速度更快（近3秒）。 但这是一个问题：

现在：

可以将消息加载为脱机状态，并且可以同时保存消息（脱机和联机）。

还是有其他更好的方法可以更快地加载？

当我在Firebase中启用脱机功能时，它无法将消息保存在服务器中，或者在保存消息时禁用了脱机功能，并且在加载消息时，它仅加载脱机消息。

例：

async function getMessagesOfAllUser(userlist){
    let outstate = false, data = {};
    if (userlist !== null)
        for (let i = userlist.length - 1; i >= 0; i--) {
            outstate = await this.getMessagesOfOneUsers(userlist[i].user);
            if (outstate !== false) data = { ...data, ...outstate };
            if (i === 0) {
                this.setState({ ...this.state, ...data });
            }
        }
}

function getMessagesOfOneUser(user) {
    return db.collection('users/'+user/+'/messages').orderBy("dt", "desc").limit(10).get().then(snap => {
        let l = snap.size;
        if (l > 0) {
            const ourMessage = this.state.me + user;
            this.lastVisible = { ...this.lastVisible, ...{ [user]: snap.docs[l - 1] } };
            for (let i = 0; i < l; i++) {
                if (this.outState[ourMessage] !== undefined)
                    this.outState[ourMessage] = [...this.outState[ourMessage], snap.docs[i].data()];
                else this.outState[ourMessage] = [snap.docs[i].data()];
                if (i === l - 1) return this.outState;
            }
        }
        return false;
    });
}

Answer 1

当您使用get() （不带参数）读取文档时，Firestore客户端将始终与服务器核对以确保您获取最新数据。

您有两个选项可从本地缓存中获取数据：

1. 使用get({ source: "cache" }) （ docs ），它将从本地缓存中返回文档。 如果文档在本地缓存中不存在，则会引发错误。 在这种情况下，您仍然需要检查服务器。

2. 使用onSnapshot()侦听器。 附加此侦听器后，它将立即使用本地缓存中的值进行回调，就像get({ source: "cache" })一样。 但是它还会与服务器一起检查数据是否有任何更新。 如果存在，它将检索更新的文档，更新本地缓存，然后使用更新的值再次调用您的代码。

如果在用户界面中显示数据，通常建议使用onSnapshot() ，因为这意味着您的UI对数据中的更改做出反应。

有关更多信息，请参阅如何启用脱机支持？ 在“ 了解Cloud Firestore视频”系列中。