Criar placares com o Firestore

1. Introdução

Última atualização: 27/01/2023

O que é preciso para criar um ranking?

Em sua essência, os placares são apenas tabelas de pontuações com um fator complicador: ler a classificação de qualquer pontuação requer conhecimento de todas as outras pontuações em algum tipo de ordem. Além disso, se o jogo decolar, os rankings crescerão e serão lidos e gravados com frequência. Para criar uma tabela de classificação bem-sucedida, ela precisa ser capaz de processar essa operação de classificação rapidamente.

O que você vai criar

Neste codelab, você vai implementar vários placares diferentes, cada um adequado para um cenário diferente.

O que você vai aprender

Você vai aprender a implementar quatro rankings diferentes:

  • Uma implementação simples que usa contagem de registros simples para determinar a classificação.
  • Um placar de classificação barato e atualizado periodicamente
  • Um placar de líderes em tempo real com algumas árvores
  • Um placar aleatório (probabilístico) para a classificação aproximada de bases de jogadores muito grandes

Pré-requisitos

  • Uma versão recente do Chrome (107 ou mais recente)
  • Node.js 16 ou mais recente (execute nvm --version para conferir o número da versão se estiver usando o nvm)
  • Um plano pago do Firebase Blaze (opcional)
  • A CLI do Firebase v11.16.0 ou mais recente
    Para instalar a CLI, execute npm install -g firebase-tools ou consulte a documentação da CLI para mais opções de instalação.
  • Conhecimento sobre JavaScript, Cloud Firestore, Cloud Functions e Chrome DevTools

2. Etapas da configuração

Acessar o código

Colocamos tudo o que você precisa para este projeto em um repositório Git. Para começar, abra o código no seu ambiente de desenvolvimento favorito. Neste codelab, usamos o VS Code, mas qualquer editor de texto serve.

e descompacte o arquivo ZIP salvo.

Ou clone no diretório de sua preferência:

git clone https://github.com/FirebaseExtended/firestore-leaderboards-codelab.git

Qual é nosso ponto de partida?

No momento, nosso projeto é uma tela em branco com algumas funções vazias:

  • index.html contém alguns scripts de união que permitem invocar funções do console do desenvolvedor e conferir as saídas delas. Vamos usar isso para interagir com nosso back-end e conferir os resultados das invocações de função. Em um cenário real, você faria essas chamadas de back-end diretamente do seu jogo. Não estamos usando um jogo neste codelab porque levaria muito tempo para jogar toda vez que você quisesse adicionar uma pontuação ao placar.
  • functions/index.js contém todas as nossas funções do Cloud. Você vai ver algumas funções utilitárias, como addScores e deleteScores, além das funções que vamos implementar neste codelab, que chamam funções auxiliares em outro arquivo.
  • functions/functions-helpers.js contém as funções vazias que vamos implementar. Para cada quadro de liderança, vamos implementar funções de leitura, criação e atualização, e você verá como a escolha da implementação afeta tanto a complexidade quanto o desempenho de escalonamento.
  • functions/utils.js contém mais funções utilitárias. Não usaremos esse arquivo neste codelab.

Criar e configurar um projeto do Firebase

  1. No Console do Firebase, clique em Adicionar projeto.
  2. Para criar um novo projeto, digite o nome dele.
    Isso também vai definir o ID do projeto (exibido abaixo do nome do projeto) como algo baseado no nome do projeto. Também é possível clicar no ícone editar no ID do projeto para personalizá-lo ainda mais.
  3. Se solicitado, leia e aceite os Termos do Firebase.
  4. Clique em Continuar.
  5. Selecione a opção Ativar o Google Analytics para este projeto e clique em Continuar.
  6. Selecione uma conta existente do Google Analytics para usar ou selecione Criar uma nova conta.
  7. Clique em Criar projeto.
  8. Quando o projeto estiver pronto, clique em Continuar.
  9. No menu Build, clique em Functions e, se solicitado, faça upgrade do seu projeto para usar o plano de faturamento Blaze.
  10. No menu Build, clique em Banco de dados do Firestore.
  11. Na caixa de diálogo Criar banco de dados exibida, selecione Iniciar no modo de teste e clique em Próximo.
  12. Escolha uma região no menu suspenso Local do Cloud Firestore e clique em Ativar.

Configure e gere seu ranking

  1. Em um terminal, navegue até a raiz do projeto e execute firebase use --add. Escolha o projeto do Firebase que você acabou de criar.
  2. Na raiz do projeto, execute firebase emulators:start --only hosting.
  3. No navegador, acesse localhost:5000.
  4. Abra o console JavaScript do Chrome DevTools e importe leaderboard.js:
    const leaderboard = await import("http://localhost:5000/scripts/leaderboard.js");
    
  5. Execute leaderboard.codelab(); no console. Se você receber uma mensagem de boas-vindas, está tudo pronto. Caso contrário, desligue o emulador e execute as etapas 2 a 4 novamente.

Vamos passar para a implementação do primeiro quadro de liderança.

3. Implementar um placar simples

Ao final desta seção, será possível adicionar uma pontuação ao quadro de liderança e fazer com que ele informe nossa classificação.

Antes de começarmos, vamos explicar como essa implementação de placares funciona: todos os jogadores são armazenados em uma única coleção, e a classificação de um jogador é feita recuperando a coleção e contando quantos jogadores estão à frente dele. Isso facilita a inserção e a atualização de uma pontuação. Para inserir uma nova pontuação, basta adicioná-la à coleção. Para atualizá-la, filtramos o usuário atual e atualizamos o documento resultante. Vamos conferir como isso fica no código.

No functions/functions-helper.js, implemente a função createScore, que é o mais simples possível:

async function createScore(score, playerID, firestore) {
  return firestore.collection("scores").doc().create({
    user: playerID,
    score: score,
  });
}

Para atualizar as notas, basta adicionar uma verificação de erro para garantir que a nota que está sendo atualizada já exista:

async function updateScore(playerID, newScore, firestore) {
  const playerSnapshot = await firestore.collection("scores")
      .where("user", "==", playerID).get();
  if (playerSnapshot.size !== 1) {
    throw Error(`User not found in leaderboard: ${playerID}`);
  }
  const player = playerSnapshot.docs[0];
  const doc = firestore.doc(player.id);
  return doc.update({
    score: newScore,
  });
}

E, por fim, nossa função de classificação simples, mas menos escalonável:

async function readRank(playerID, firestore) {
  const scores = await firestore.collection("scores")
      .orderBy("score", "desc").get();
  const player = `${playerID}`;
  let rank = 1;
  for (const doc of scores.docs) {
    const user = `${doc.get("user")}`;
    if (user === player) {
      return {
        user: player,
        rank: rank,
        score: doc.get("score"),
      };
    }
    rank++;
  }
  // No user found
  throw Error(`User not found in leaderboard: ${playerID}`);
}

Vamos testar! Implante as funções executando o seguinte comando no terminal:

firebase deploy --only functions

Depois, no console JS do Chrome, adicione outras pontuações para que possamos ver nossa classificação entre outros jogadores.

leaderboard.addScores(); // Results may take some time to appear.

Agora podemos adicionar nossa própria pontuação à combinação:

leaderboard.addScore(999, 11); // You can make up a score (second argument) here.

Quando a gravação for concluída, você verá uma resposta no console informando "Pontuação criada". Aparece um erro? Abra os registros do Functions no Console do Firebase para saber o que deu errado.

Por fim, podemos buscar e atualizar nossa pontuação.

leaderboard.getRank(999);
leaderboard.updateScore(999, 0);
leaderboard.getRank(999); // we should be last place now (11)

No entanto, essa implementação nos dá requisitos de tempo e memória lineares indesejáveis para buscar a classificação de uma determinada pontuação. Como o tempo de execução da função e a memória são limitados, isso não apenas vai fazer com que as buscas fiquem cada vez mais lentas. Além disso, depois que pontuações suficientes forem adicionadas ao placar, as funções vão expirar ou falhar antes de retornar um resultado. Obviamente, precisaremos de algo melhor para expandirmos além de alguns jogadores.

Se você é um fã do Firestore, talvez conheça COUNT consultas de agregação, que tornariam esse ranking muito mais eficiente. E você está certo! Com as consultas COUNT, isso é escalonado abaixo de um milhão de usuários, mas o desempenho ainda é linear.

Mas espere, você pode estar pensando: se vamos enumerar todos os documentos na coleção de qualquer maneira, podemos atribuir uma classificação a cada documento e, então, quando precisarmos buscá-lo, nossas buscas serão O(1) tempo e memória! Isso nos leva à nossa próxima abordagem, o ranking que é atualizado periodicamente.

4. Implemente um ranking que atualiza periodicamente

A chave para essa abordagem é armazenar a classificação no próprio documento. Assim, a busca fornece a classificação sem trabalho extra. Para isso, vamos precisar de um novo tipo de função.

Em index.js, inclua o seguinte:

// Also add this to the top of your file
const admin = require("firebase-admin");

exports.scheduledFunctionCrontab = functions.pubsub.schedule("0 2 * * *")
    // Schedule this when most of your users are offline to avoid
    // database spikiness.
    .timeZone("America/Los_Angeles")
    .onRun((context) => {
      const scores = admin.firestore().collection("scores");
      scores.orderBy("score", "desc").get().then((snapshot) => {
        let rank = 1;
        const writes = [];
        for (const docSnapshot of snapshot.docs) {
          const docReference = scores.doc(docSnapshot.id);
          writes.push(docReference.set({rank: rank}, admin.firestore.SetOptions.merge()));
          rank++;
        }
        Promise.all(writes).then((result) => {
          console.log(`Writes completed with results: ${result}`);
        });
      });
      return null;
    });

Agora nossas operações de leitura, atualização e gravação são simples. A gravação e a atualização permanecem inalteradas, mas a leitura se torna (em functions-helpers.js):

async function readRank(playerID, firestore) {
  const scores = firestore.collection("scores");
  const playerSnapshot = await scores
      .where("user", "==", playerID).get();
  if (playerSnapshot.size === 0) {
    throw Error(`User not found in leaderboard: ${playerID}`);
  }

  const player = playerSnapshot.docs[0];
  if (player.get("rank") === undefined) {
    // This score was added before our scheduled function could run,
    // but this shouldn't be treated as an error
    return {
    user: playerID,
    rank: null,
    score: player.get("score"),
  };
  }

  return {
    user: playerID,
    rank: player.get("rank"),
    score: player.get("score"),
  };
}

Infelizmente, não é possível implantar e testar esse recurso sem adicionar uma conta de faturamento ao seu projeto. Se você tiver uma conta de faturamento, reduza o intervalo na função programada e veja como ela atribui classificações às pontuações do placar.

Caso contrário, exclua a função programada e avance para a próxima implementação.

Exclua as pontuações do banco de dados do Firestore clicando nos três pontos ao lado da coleção de pontuações e se prepare para a próxima seção.

Página do documento de pontuações do Firestore com a opção\nExcluir coleção ativada

5. Implementar uma tabela de classificação de árvores em tempo real

Essa abordagem funciona armazenando dados de pesquisa na própria coleção do banco de dados. Em vez de ter uma coleção uniforme, nosso objetivo é armazenar tudo em uma árvore que possa ser percorrida ao passar pelos documentos. Isso permite que façamos uma pesquisa binária (ou n-ária) para a classificação de uma determinada nota. Como isso pode ser?

Para começar, vamos querer distribuir nossas pontuações em intervalos praticamente iguais, o que exigirá algum conhecimento dos valores das pontuações que nossos usuários estão registrando; Por exemplo, se você estiver criando um ranking de classificação de habilidades em um jogo competitivo, o valor as classificações de habilidades quase sempre terão uma distribuição normal. Nossa função de geração aleatória de pontuação usa a Math.random() do JavaScript, que resulta em uma distribuição aproximadamente uniforme. Portanto, dividiremos nossos buckets uniformemente.

Neste exemplo, usaremos três buckets para simplificar, mas você provavelmente descobrirá que, se usar essa implementação em um app real, mais buckets produzirão resultados mais rápidos. Uma árvore mais superficial significa, em média, menos buscas de coleta e menos contenção de bloqueio.

A classificação de um jogador é dada pela soma do número de jogadores com pontuações mais altas, mais um para o jogador. Cada coleção em scores vai armazenar três documentos, cada um com um intervalo, o número de documentos em cada intervalo e três subcoleções correspondentes. Para ler uma classificação, atravessaremos essa árvore procurando por uma pontuação e acompanhando a soma das pontuações maiores. Quando encontrarmos a pontuação, também teremos o valor correto.

A escrita é muito mais complicada. Primeiro, precisamos fazer todas as gravações em uma transação para evitar inconsistências de dados quando várias gravações ou leituras ocorrem ao mesmo tempo. Também precisaremos manter todas as condições descritas acima à medida que atravessamos a árvore para gravar nossos novos documentos. E, finalmente, como temos toda a complexidade de árvore dessa nova abordagem combinada com a necessidade de armazenar todos os nossos documentos originais, nosso custo de armazenamento vai aumentar um pouco (mas ainda é linear).

Em functions-helpers.js:

async function createScore(playerID, score, firestore) {
  /**
   * This function assumes a minimum score of 0 and that value
   * is between min and max.
   * Returns the expected size of a bucket for a given score
   * so that bucket sizes stay constant, to avoid expensive
   * re-bucketing.
   * @param {number} value The new score.
   * @param {number} min The min of the previous range.
   * @param {number} max The max of the previous range. Must be greater than
   *     min.
   * @return {Object<string, number>} Returns an object containing the new min
   *     and max.
   */
  function bucket(value, min, max) {
    const bucketSize = (max - min) / 3;
    const bucketMin = Math.floor(value / bucketSize) * bucketSize;
    const bucketMax = bucketMin + bucketSize;
    return {min: bucketMin, max: bucketMax};
  }

  /**
   * A function used to store pending writes until all reads within a
   * transaction have completed.
   *
   * @callback PendingWrite
   * @param {admin.firestore.Transaction} transaction The transaction
   *     to be used for writes.
   * @return {void}
   */

  /**
   * Recursively searches for the node to write the score to,
   * then writes the score and updates any counters along the way.
   * @param {number} id The user associated with the score.
   * @param {number} value The new score.
   * @param {admin.firestore.CollectionReference} coll The collection this
   *     value should be written to.
   * @param {Object<string, number>} range An object with properties min and
   *     max defining the range this score should be in. Ranges cannot overlap
   *     without causing problems. Use the bucket function above to determine a
   *     root range from constant values to ensure consistency.
   * @param {admin.firestore.Transaction} transaction The transaction used to
   *     ensure consistency during tree updates.
   * @param {Array<PendingWrite>} pendingWrites A series of writes that should
   *     occur once all reads within a transaction have completed.
   * @return {void} Write error/success is handled via the transaction object.
   */
  async function writeScoreToCollection(
      id, value, coll, range, transaction, pendingWrites) {
    const snapshot = await transaction.get(coll);
    if (snapshot.empty) {
      // This is the first score to be inserted into this node.
      for (const write of pendingWrites) {
        write(transaction);
      }
      const docRef = coll.doc();
      transaction.create(docRef, {exact: {score: value, user: id}});
      return;
    }

    const min = range.min;
    const max = range.max;

    for (const node of snapshot.docs) {
      const data = node.data();
      if (data.exact !== undefined) {
        // This node held an exact score.
        const newRange = bucket(value, min, max);
        const tempRange = bucket(data.exact.score, min, max);

        if (newRange.min === tempRange.min &&
          newRange.max === tempRange.max) {
          // The scores belong in the same range, so we need to "demote" both
          // to a lower level of the tree and convert this node to a range.
          const rangeData = {
            range: newRange,
            count: 2,
          };
          for (const write of pendingWrites) {
            write(transaction);
          }
          const docReference = node.ref;
          transaction.set(docReference, rangeData);
          transaction.create(docReference.collection("scores").doc(), data);
          transaction.create(
              docReference.collection("scores").doc(),
              {exact: {score: value, user: id}},
          );
          return;
        } else {
          // The scores are in different ranges. Continue and try to find a
          // range that fits this score.
          continue;
        }
      }

      if (data.range.min <= value && data.range.max > value) {
        // The score belongs to this range that may have subvalues.
        // Increment the range's count in pendingWrites, since
        // subsequent recursion may incur more reads.
        const docReference = node.ref;
        const newCount = node.get("count") + 1;
        pendingWrites.push((t) => {
          t.update(docReference, {count: newCount});
        });
        const newRange = bucket(value, min, max);
        return writeScoreToCollection(
            id,
            value,
            docReference.collection("scores"),
            newRange,
            transaction,
            pendingWrites,
        );
      }
    }

    // No appropriate range was found, create an `exact` value.
    transaction.create(coll.doc(), {exact: {score: value, user: id}});
  }

  const scores = firestore.collection("scores");
  const players = firestore.collection("players");
  return firestore.runTransaction((transaction) => {
    return writeScoreToCollection(
        playerID, score, scores, {min: 0, max: 1000}, transaction, [],
    ).then(() => {
      transaction.create(players.doc(), {
        user: playerID,
        score: score,
      });
    });
  });
}

Isso é certamente mais complicado do que nossa última implementação, que era uma única chamada de método e apenas seis linhas de código. Depois de implementar esse método, tente adicionar algumas pontuações ao banco de dados e observar a estrutura da árvore resultante. No console do JS:

leaderboard.addScores();

A estrutura do banco de dados resultante deve ser semelhante a esta, com a estrutura de árvore claramente visível e as folhas da árvore representando as pontuações individuais.

scores
  - document
    range: 0-333.33
    count: 2
    scores:
      - document
        exact:
          score: 18
          user: 1
      - document
        exact:
          score: 22
          user: 2

Agora que a parte difícil acabou, podemos ler as pontuações percorrendo a árvore, conforme descrito anteriormente.

async function readRank(playerID, firestore) {
  const players = await firestore.collection("players")
      .where("user", "==", playerID).get();
  if (players.empty) {
    throw Error(`Player not found in leaderboard: ${playerID}`);
  }
  if (players.size > 1) {
    console.info(`Multiple scores with player ${playerID}, fetching first`);
  }
  const player = players.docs[0].data();
  const score = player.score;

  const scores = firestore.collection("scores");

  /**
   * Recursively finds a player score in a collection.
   * @param {string} id The player's ID, since some players may be tied.
   * @param {number} value The player's score.
   * @param {admin.firestore.CollectionReference} coll The collection to
   *     search.
   * @param {number} currentCount The current count of players ahead of the
   *     player.
   * @return {Promise<number>} The rank of the player (the number of players
   *     ahead of them plus one).
   */
  async function findPlayerScoreInCollection(id, value, coll, currentCount) {
    const snapshot = await coll.get();
    for (const doc of snapshot.docs) {
      if (doc.get("exact") !== undefined) {
        // This is an exact score. If it matches the score we're looking
        // for, return. Otherwise, check if it should be counted.
        const exact = doc.data().exact;
        if (exact.score === value) {
          if (exact.user === id) {
            // Score found.
            return currentCount + 1;
          } else {
            // The player is tied with another. In this case, don't increment
            // the count.
            continue;
          }
        } else if (exact.score > value) {
          // Increment count
          currentCount++;
          continue;
        } else {
          // Do nothing
          continue;
        }
      } else {
        // This is a range. If it matches the score we're looking for,
        // search the range recursively, otherwise, check if it should be
        // counted.
        const range = doc.data().range;
        const count = doc.get("count");
        if (range.min > value) {
          // The range is greater than the score, so add it to the rank
          // count.
          currentCount += count;
          continue;
        } else if (range.max <= value) {
          // do nothing
          continue;
        } else {
          const subcollection = doc.ref.collection("scores");
          return findPlayerScoreInCollection(
              id,
              value,
              subcollection,
              currentCount,
          );
        }
      }
    }
    // There was no range containing the score.
    throw Error(`Range not found for score: ${value}`);
  }

  const rank = await findPlayerScoreInCollection(playerID, score, scores, 0);
  return {
    user: playerID,
    rank: rank,
    score: score,
  };
}

As atualizações são deixadas como um exercício extra. Tente adicionar e buscar pontuações no console do JS com os métodos leaderboard.addScore(id, score) e leaderboard.getRank(id) e veja como a tabela de classificação muda no console do Firebase.

No entanto, com essa implementação, a complexidade que adicionamos para alcançar o desempenho logarítmico tem um custo.

  • Primeiro, essa implementação de placar pode ter problemas de contenção de bloqueio, já que as transações exigem leituras e gravações de bloqueio em documentos para garantir a consistência deles.
  • Segundo, o Firestore impõe um limite de profundidade de subcoleção de 100, o que significa que você precisará evitar a criação de subárvores após 100 pontuações empatadas, o que não é permitido por essa implementação.
  • E, por fim, o quadro de liderança escalona logaritmicamente apenas no caso ideal em que a árvore está equilibrada. Se estiver desequilibrado, o pior desempenho desse ranking é mais uma vez linear.

Quando terminar, exclua as coleções scores e players pelo console do Firebase e vamos passar para a última implementação de placares.

6. Implementar um ranking estocástico (probabilístico)

Ao executar o código de inserção, você pode notar que, se ele for executado muitas vezes em paralelo, suas funções vão começar a falhar com uma mensagem de erro relacionada à contenção de bloqueio de transações. Há maneiras de contornar isso que não serão abordadas neste codelab, mas, se você não precisar de uma classificação exata, pode abandonar toda a complexidade da abordagem anterior para algo mais simples e rápido. Vamos conferir como podemos retornar uma classificação estimada para as pontuações dos jogadores em vez de uma classificação exata e como isso muda a lógica do banco de dados.

Para essa abordagem, vamos dividir nossa tabela de classificação em 100 buckets, cada um representando aproximadamente 1% das pontuações que esperamos receber. Essa abordagem funciona mesmo sem o conhecimento da distribuição de pontuação. Nesse caso, não há como garantir uma distribuição aproximada de pontuações em todo o bucket, mas vamos conseguir maior precisão nas nossas aproximações se soubermos como as pontuações serão distribuídas.

Nossa abordagem é a seguinte: como antes, cada bucket armazena a contagem do número de pontuações e o intervalo delas. Ao inserir uma nova pontuação, vamos encontrar o bucket dela e incrementar a contagem. Ao buscar uma classificação, somamos os buckets à frente dela e fazemos uma estimativa no nosso bucket, em vez de pesquisar mais. Isso nos proporciona pesquisas de tempo constantes e muito boas e exige muito menos código.

Primeiro, a inserção:

// Add this line to the top of your file.
const admin = require("firebase-admin");

// Implement this method (again).
async function createScore(playerID, score, firestore) {
  const scores = await firestore.collection("scores").get();
  if (scores.empty) {
    // Create the buckets since they don't exist yet.
    // In a real app, don't do this in your write function. Do it once
    // manually and then keep the buckets in your database forever.
    for (let i = 0; i < 10; i++) {
      const min = i * 100;
      const max = (i + 1) * 100;
      const data = {
        range: {
          min: min,
          max: max,
        },
        count: 0,
      };
      await firestore.collection("scores").doc().create(data);
    }
    throw Error("Database not initialized");
  }

  const buckets = await firestore.collection("scores")
      .where("range.min", "<=", score).get();
  for (const bucket of buckets.docs) {
    const range = bucket.get("range");
    if (score < range.max) {
      const writeBatch = firestore.batch();
      const playerDoc = firestore.collection("players").doc();
      writeBatch.create(playerDoc, {
        user: playerID,
        score: score,
      });
      writeBatch.update(
          bucket.ref,
          {count: admin.firestore.FieldValue.increment(1)},
      );
      const scoreDoc = bucket.ref.collection("scores").doc();
      writeBatch.create(scoreDoc, {
        user: playerID,
        score: score,
      });
      return writeBatch.commit();
    }
  }
}

Você notará que esse código de inserção tem alguma lógica para inicializar o estado do banco de dados na parte superior, com um aviso para não fazer algo assim na produção. O código de inicialização não é protegido contra condições de corrida. Portanto, se você fizer isso, várias gravações simultâneas corromperão seu banco de dados, gerando vários buckets duplicados.

Implante suas funções e execute uma inserção para inicializar todos os buckets com uma contagem zero. Ele vai retornar um erro, que pode ser ignorado com segurança.

leaderboard.addScore(999, 0); // The params aren't important here.

Agora que o banco de dados foi inicializado corretamente, podemos executar addScores e ver a estrutura dos dados no Console do Firebase. A estrutura resultante é muito mais simples do que a última implementação, embora seja superficialmente semelhante.

leaderboard.addScores();

E, agora, para ler as pontuações:

async function readRank(playerID, firestore) {
  const players = await firestore.collection("players")
      .where("user", "==", playerID).get();
  if (players.empty) {
    throw Error(`Player not found in leaderboard: ${playerID}`);
  }
  if (players.size > 1) {
    console.info(`Multiple scores with player ${playerID}, fetching first`);
  }
  const player = players.docs[0].data();
  const score = player.score;

  const scores = await firestore.collection("scores").get();
  let currentCount = 1; // Player is rank 1 if there's 0 better players.
  let interp = -1;
  for (const bucket of scores.docs) {
    const range = bucket.get("range");
    const count = bucket.get("count");
    if (score < range.min) {
      currentCount += count;
    } else if (score >= range.max) {
      // do nothing
    } else {
      // interpolate where the user is in this bucket based on their score.
      const relativePosition = (score - range.min) / (range.max - range.min);
      interp = Math.round(count - (count * relativePosition));
    }
  }

  if (interp === -1) {
    // Didn't find a correct bucket
    throw Error(`Score out of bounds: ${score}`);
  }

  return {
    user: playerID,
    rank: currentCount + interp,
    score: score,
  };
}

Como fizemos com que a função addScores gere uma distribuição uniforme de pontuações e estamos usando interpolação linear nos buckets, temos resultados muito precisos, o desempenho do nosso ranking não diminui à medida que aumentamos o número de usuários, e não precisamos nos preocupar com a contenção de bloqueio (tanto) ao atualizar as contagens.

7. Adendo: trapaça

Se eu escrevo valores no meu codelab usando o console JS de uma guia do navegador, você pode estar pensando: nenhum dos jogadores pode mentir no placar e dizer que recebeu uma pontuação alta, que não foi alcançada de maneira justa?

Sim, é possível. Se quiser evitar fraudes, a maneira mais eficiente de fazer isso é desativar as gravações de clientes no banco de dados usando regras de segurança, proteger o acesso ao Cloud Functions para que os clientes não possam chamá-las diretamente e validar as ações no jogo no seu servidor antes de enviar atualizações de pontuação para o placar.

É importante observar que essa estratégia não é uma panaceia contra a trapaça. Com um incentivo grande o suficiente, os trapaceiros podem encontrar maneiras de burlar as validações do lado do servidor, e muitos videogames grandes e bem-sucedidos estão constantemente jogando gato e rato com seus trapaceiros para identificar novas fraudes e impedir que proliferem. Uma consequência difícil desse fenômeno é que a validação do lado do servidor para cada jogo é inerentemente sob medida. Embora o Firebase forneça ferramentas antiabuso, como o App Check, que impedem um usuário de copiar seu jogo usando um cliente com script simples, ele não fornece nenhum serviço que se aproxime de um antifraude holístico.

Qualquer coisa que não seja uma validação do lado do servidor, para um jogo suficientemente popular ou uma barreira baixa o suficiente para trapaças, resultará em uma tabela de classificação em que os valores mais altos são todos trapaceiros.

8. Parabéns

Parabéns! Você criou quatro tabelas de classificação diferentes no Firebase. Dependendo das necessidades de precisão e velocidade do jogo, é possível escolher uma que funcione para você por um custo razoável.

A seguir, confira os programas de treinamento para jogos.