Carregue a primeira parte jogável
Agrupe os ativos no momento em que forem necessários: título e primeira cena, próximo nível e, em seguida, efeitos opcionais ou cosméticos. Carregue e valide o primeiro grupo antes de ativar a ação inicial. Para imagens usadas em uma transição repentina de cena, HTMLImageElement.decode() pode ser resolvido após a decodificação de uma imagem, permitindo que a troca aconteça sem fazer com que o próximo desenho espere pela decodificação.
Teste em uma conexão limitada: atrase uma imagem obrigatória e faça outra falhar. O indicador de progresso só deve avançar quando cada tarefa identificada for concluída. O recurso que falhar deve gerar uma mensagem recuperável ou usar uma alternativa, e o botão de início não deve prometer uma cena jogável se faltar uma dependência obrigatória.
Mantenha o progresso honesto
Quando o conjunto de tarefas for conhecido, mostre as tarefas concluídas do total ou relate uma fase como a preparação do primeiro nível. As porcentagens baseadas em bytes só são significativas quando os tamanhos relevantes são conhecidos; a decodificação, a configuração de áudio e a inicialização do procedimento podem levar algum tempo após a conclusão da transferência.
Não bloqueie toda a interface para ativos que possam chegar posteriormente. Use um espaço reservado de baixo custo para arte opcional e substitua-o quando a imagem decodificada estiver pronta. Verifique se o espaço reservado permanece legível no tamanho de tela pretendido e se uma falha no download opcional não prende o player no estado de carregamento.
Perguntas sobre carregamento de recursos de jogos do navegador
Pré-carregar todos os ativos é uma boa ideia?
Geralmente não por padrão. Carregue o que for necessário para o primeiro momento jogável e depois agende outro trabalho com base em quando será usado e na quantidade de memória necessária.
Um evento de carregamento de imagem significa que ela está pronta para um desenho suave?
Os dados podem estar disponíveis enquanto a decodificação ainda afeta a apresentação. A MDN documenta que decode() retorna uma promessa que é resolvida quando a imagem é decodificada e pode ser adicionada com segurança. Meça se essa diferença importa na sua cena.
Leitura complementar
Viu alguma informação desatualizada? Informar uma correção