Comment optimiser les opérations de lecture-écriture dans le cloud Firestore?

Question

J'écris actuellement un projet react + Firebase à des fins d'apprentissage, et je me demande quelle approche dois-je adopter pour lire efficacement depuis Firebase.

Disons que j'ai cette collection en lecture seule appelée produit où elle contient environ 5000 documents.Par conséquent, lorsque l'utilisateur accède à mon application React, elle sera facturée 5000 lectures par accès.

Source: Cloud Firestore: Comment la lecture est-elle calculée?

Étant donné que cela consomme assez rapidement le nombre de lectures si les spams des utilisateurs sont actualisés pour réagir à l'application, existe-t-il un moyen approprié de lire les données de Firebase Firestore?

1. Stocker les informations sur le produit dans un stockage local

   • Une fois que React app a chargé les données avec succès, enregistrez les informations sur le produit dans le stockage local pour éviter un chargement inopportun à l'avenir.

2. utiliser SOURCE.CACHE de firebase

   • L'idée est similaire à localstorage, mais au lieu d'utiliser localstorage, nous pouvons utiliser SOURCE. CACHE pour récupérer les données du cache en forçant Firebase en mode hors ligne. La source :https://firebase.google.com/docs/firestore/manage-data/enable-offline
   • Comment éviter les lectures Firestore inutiles avec Cache , c'est le plus proche de ma requête actuelle, mais ma collection ne contient que des données en lecture seule et ne sera pas mise à jour.Je ne pourrai peut-être pas ajouter un écouteur d'instantané. Veuillez me faire savoir si j'ai mal compris la fonctionnalité.

3. limite de lecture de la requête?

   • Limite un nombre fixe de documents retournés pour chaque chargement, mais à la fin de la journée, je devrai toujours charger l'ensemble complet des documents, donc je suis assez sceptique à ce sujet.

C'est ce à quoi je peux penser jusqu'à présent, merci de bien vouloir me faire savoir s'il existe une norme ou une procédure d'or dans la conception du bâtiment de votre application.

Merci.

Answer 1

Vous devez absolument introduire une stratégie de pagination. Une autre façon intelligente consiste à interroger en fonction de l'heure de la dernière mutation. Firestore met automatiquement en cache vos données sur le Web s'il enablePersistenceest configuré (sinon, il est défini sur false).

Vous pouvez introduire une stratégie pour interroger uniquement en utilisant le réseau après une certaine période. Cependant, vous devez garder une trace par module lorsque la dernière requête en ligne a été effectuée.

function strategicFirestoreReadWrite(moduleKey, actionFn) {
  const lastFetchedDate = sessionStorage.getItem(moduleKey) || new Date();
  const difference = Math.abs(lastFetchedDate.getTime() - new Date().getTime())
  const hourDifference = difference  / 1000 / 3600
  const logToStorageFn = () => {
    sessionStorage.setItem(moduleKey, new Date())
  }

  // Performing operation offline when last fetch earlier than 3 hours
  if (hourDifference < 3) {
   firebase
     .firestore()
     .disableNetwork()
     .then(actionFn)
     .then(logToStorageFn)
  } else {
   firebase
       .firestore()
       .enableNetwork()
       .then(actionFn)
       .then(logToStorageFn)
  }
}

Cela peut être une fonction utilitaire pour toutes vos Firestoreopérations pour une session de page spécifique. Maintenant, ce que vous voulez faire est de transmettre un identifiant unique et toute action hors ligne ou en ligne que vous souhaitez effectuer; peut-être une extraction, une insertion, une mise à jour ou une suppression; avec une fonction. Vous serez sûr que la fonction s'exécute en mode hors ligne ou en ligne en fonction de la dernière heure de lecture-écriture.

strategicFirestoreReadWrite(window.location.href, () => {

   //whatever operation you want to perform in online or offline mode
})

Answer 2

Vous avez énuméré plusieurs bonnes options. Nous utilisons la pagination dans notre application pour limiter les requêtes de lecture et également pour améliorer la vitesse de chargement. Par exemple, nous ne montrons que 50 éléments par page et nous en chargeons plus en cliquant ou en faisant défiler (défilement infini) Si les données ne changent pas souvent, vous pouvez les mettre en cache sur le frontend, mais cela introduit de nombreux problèmes supplémentaires :).