Depurar em Pré-visualização

Como você pode depurar sua cena enquanto a executa localmente em pré-visualização

Executar uma pré-visualização fornece algumas informações e ferramentas de depuração úteis para ajudar você a entender como a cena é renderizada.

Se a cena não puder ser compilada, você verá apenas o chão vazio, sem nada renderizado sobre ele. Se isso ocorrer, há vários locais onde você pode procurar mensagens de erro para entender o que deu errado:

  1. Verifique seu editor de código para garantir que ele não marcou erros de sintaxe ou de lógica.

  2. Verifique o console na janela de pré-visualização para quaisquer mensagens de erro. Abra o console clicando no  ícone no canto superior direito.

  3. Se você executou a cena usando o Creator Hub, verifique a janela com a saída do console da cena. Se você executou a cena usando o CLI, verifique a saída da linha de comando onde você executou npm run start

circle-info

💡 Dica: Antes de publicar sua cena no ambiente de produção, publique-a no ambiente de teste para experimentá-la em um contexto muito mais próximo da produção. Veja Fluxo de Desenvolvimentoarrow-up-right

Use o console

Abra o console clicando no  ícone no canto superior direito.

Você também pode alterná-lo pressionando a tecla backtick no seu teclado: **. Esta tecla fica à esquerda da tecla 1 na maioria dos teclados em inglês. Ou então pressione Shift + **\ para abrir uma visualização maior do console, caso você precise ver mais texto.

Enviar mensagens para o console (usando console.log()). Você pode então visualizar essas mensagens conforme são geradas abrindo o console da cena.

O console também mostra mensagens de erro, que são marcadas em vermelho.

O painel de depuração

Abra o console de depuração clicando no  ícone no canto superior direito.

Isso abre um painel no canto inferior direito com informações sobre o motor de renderização, e é atualizado em tempo real conforme as coisas mudam.



Cena atual

O CENA ATUAL a aba inclui informações sobre a cena na qual você está atualmente. Isso inclui:

  • O número de parcelas na cena

  • A altura máxima na qual você tem permissão para construir (que é proporcional ao número de parcelas na cena)

Você também pode verificar o Mostrar Limites da Cena opção para ver paredes vermelhas ao redor da cena, que marcam os limites da cena.

Memória

O MEMÓRIA a seção exibe a memória usada pelo Decentraland. Sempre tente manter esse valor abaixo do Limiares do Orçamento de Memória. Se esse valor crescer demais, corre o risco de travar o aplicativo para os jogadores que visitam sua cena. Tenha em mente que, em produção, a cena pode ser carregada junto com outras cenas e jogadores ao redor, o que pode contribuir para aumentar o consumo de memória além do que você vê na pré-visualização.

Desempenho

O DESEMPENHO a aba inclui vários campos relacionados a FPS (Frames Per Second). Esse valor tende a ser menor à medida que a cena cresce em complexidade; certifique-se de manter esse valor sempre acima de 25 FPS, para garantir uma boa experiência para seus jogadores. O FPS varia dependendo da máquina em que você executa isto.

O valor mais importante aqui é o FPS Médio, que arredonda o FPS dos últimos 1000 frames.


circle-exclamation

Engasgos referem-se a pausas momentâneas na taxa de quadros, que podem ter pouco impacto no número geral de FPS, mas podem ser muito notáveis para o jogador. Esses geralmente podem ocorrer quando recursos pesados são carregados ou situações similares.

Requisições Web

O REQUISIÇÕES WEB a seção permite que você abra a aba Network do Chrome DevTools, que exibe o número de requisições web feitas pela cena e seus conteúdos. Isso é útil para saber se a cena está fazendo muitas requisições a servidores, o que pode impactar o desempenho da cena.

Se sua cena interage com um servidor de terceiros, muitas vezes é útil ver quais dados entram e saem. Clique em Abrir Chrome Devtools para abrir uma nova janela do Chrome com a aba Network aberta.

circle-exclamation

Como alternativa, existem várias ferramentas gratuitas que você pode executar na sua máquina que relatam todos os dados que entram e saem da aplicação Decentraland. Por exemplo Charlesarrow-up-right ou Wiresharkarrow-up-right.

Recarregamento rápido

Sempre que você fizer alterações na cena, a pré-visualização recarrega e atualiza automaticamente, então não há necessidade de abrir e fechar a janela de pré-visualização.

Se você precisar recarregar a cena em que está, clique no Recarregar Cena botão no canto superior esquerdo da janela de pré-visualização.



Você também pode recarregar a cena escrevendo o seguinte no chat e pressionando enter:

/reload

Reportar um bug

Se você encontrar um problema que não esteja relacionado à sua cena, mas sim ao SDK do Decentraland em geral, por favor veja Reportar um bugarrow-up-right.

Versões de dependências

Certifique-se de sempre usar as versões mais recentes de todas as dependências da sua cena, pois quaisquer problemas que você esteja enfrentando podem já ter sido corrigidos em versões mais novas. O Creator Hub notificará quando houver atualizações para instalar na sua cena do Decentraland.



Você também pode atualizar manualmente as dependências via linha de comando. Executar uma cena do Decentraland localmente depende de duas bibliotecas principais: @dcl/sdk e @dcl/js-runtime, que é instalada em cada pasta de projeto. Certifique-se de que ambas estejam atualizadas. Você pode executar os seguintes comandos para atualizar manualmente ambas as bibliotecas para a última versão estável:

Se sua cena usa smart items, ela também pode estar usando a @dcl/asset-packs library, que você pode atualizar via:

Se você estiver usando qualquer uma das bibliotecas utilsarrow-up-right certifique-se de que elas também estejam atualizadas, pois versões antigas dessas bibliotecas podem não ser compatíveis com versões mais novas do @dcl/sdk.

Condições de iluminação

A hora do dia no mundo tem um grande impacto em como os modelos 3D aparecem. A cor da fonte de luz muda sutilmente, tendo um tom azulado à noite e um tom avermelhado durante o nascer e o pôr do sol. A direção da luz também se move pelo céu, projetando sombras em direções diferentes.

Verifique se sua cena parece boa em todos os momentos do dia alterando o relógio do jogo para valores diferentes. Clique no ícone de tempo do skybox no painel esquerdo da tela para definir qualquer horário que preferir. Se esse controle deslizante estiver esmaecido, certifique-se de que a opção Auto esteja desativada.

Dynamic skybox
Instruções no mundo

Os materiais do seu modelo 3D podem não parecer os mesmos que pareciam na ferramenta de modelagem com a qual você o criou. Isso é esperado, pois todos os motores de renderização 3D têm diferenças sutis em como lidam com luz e materiais.

Você também pode configurar sua cena para que o horário do dia seja fixo e a iluminação não mude. Veja Controle do Skyboxarrow-up-right para mais detalhes.

Testes multiplayer

Se você iniciar uma pré-visualização da cena e abri-la em duas (ou mais) janelas diferentes do Explorer, cada janela aberta será interpretada como um jogador separado, e um servidor de comunicações simulado manterá esses jogadores sincronizados.

Interaja com a cena em uma janela, depois mude para a outra para ver que os efeitos dessa interação também são visíveis lá.

Usando o Creator Hub, clique no botão Preview uma segunda vez, e isso abrirá uma segunda janela do Decentraland Explorer. Você deve conectar-se em ambas as janelas com endereços diferentes. As mesmas sessões permanecerão abertas conforme a cena recarrega. Pode ser necessário fazer logout e login novamente na segunda janela para selecionar uma conta diferente.



Ambos os jogadores irão se ver e poderão interagir entre si. Se a cena tiver qualquer lógica multiplayer, ela funcionará conforme esperado e será sincronizada entre os dois jogadores.

Como alternativa, você pode abrir uma segunda janela do Decentraland Explorer escrevendo o seguinte em uma URL do navegador:

decentraland://realm=http://127.0.0.1:8000&local-scene=true&debug=true

Usando a rede de testes Ethereum

Ao testar sua cena, para evitar transferir MANA real ou outras moedas, você pode usar a rede de testes Ethereum Sepolia e transferir MANA de teste falso em seu lugar.

Para usar a rede de testes você deve configurar sua extensão Metamask no Chrome para usar a rede de testes Sepolia em vez da Rede principal. Você também deve possuir MANA na blockchain Sepolia, que você pode adquirir gratuitamente no Decentraland.

circle-info

💡 Dica: Para executar a transação de transferência de MANA Sepolia para sua carteira, você precisará pagar uma taxa de gas em Sepolia Ether.

Quaisquer transações que você aceitar enquanto visualizar a cena nesse modo ocorrerão apenas na rede de testes e não afetarão o saldo de MANA na sua carteira real.

Para pré-visualizar sua cena usando a rede de testes, cole a seguinte URL em uma aba do navegador. Isso abrirá a cena no cliente desktop do Decentraland:

decentraland://realm=http://127.0.0.1:8000&local-scene=true&debug=true&dclenv=zone&position=0,0

circle-info

💡 Dica: Altere o parâmetro position para as coordenadas da sua cena, para carregar diretamente na sua cena. Quaisquer transações que você aceitar enquanto visualizar a cena nesse modo ocorrerão apenas na rede de testes e não afetarão o saldo de MANA na sua carteira real.

Se você precisar testar transações na Polygon Testnet e precisar ter MANA nessa testnet, será necessário trocar MANA para essa rede após adquiri-lo em Sepolia. Para fazer o bridge do MANA de Sepolia para a Polygon Testnet, visite a página da sua conta Decentraland em Sepolia e clique em 'swap' no lado Ethereum do MANA.

Atualizado