Frames Per Second - FPS

Frames Per Second(FPS) é um termo utilizado para determinar a quantidade de quadros ou animações renderizados em um segundo. Em jogos digitais, 60FPS é uma boa taxa de renderização, sendo 30FPS um mínimo aceitável para manter uma qualidade razoável no jogo.
Um jogo que opera a uma taxa de 60FPS implica que a cada segundo temos 60 frames renderizados. Ao dividirmos 1 por 60, obtemos aproximadamente 0,0166666, isso significa que cada frame precisa ser renderizado em apenas 0,0166666 de segundo, é um tempo muito pequeno, então para facilitar a vida é melhor trabalhar com uma outra unidade de tempo, o milissegundos. 1 segundo equivale a 1000 milissegundos, o que significa que 0,0166666 de segundo é aproximadamente igual a 16,666666 Milissegundos, basta multiplicar 0,166666 por 1000. Então podemos afirmar que em um jogo a uma taxa de 60FPS tem aproximadamente 16,66666 Milissegundos para renderizar cada frame. A Listagem 1 mostra a implementação de FPS em JavaScript.

Listagem 1

Nas linhas 21 e 25 temos uma chamada ao método requestAnimationFrame, esse método normalmente é invocado pelo navegador a uma taxa de 60FPS, mas é claro que em uma máquina lenta essa taxa pode ser menor da mesma forma que em uma máquina rápida essa taxa pode ser maior. Além disso, essa chamada a 60FPS depende também da quantidade de operações realizadas antes da próxima invocação a requestAnimationFrame, pois como descrito anteriormente, haverá apenas 16,66666 Milissegundos para realizar todas as atualizações e renderizações antes do próximo frame. Se para as operações de atualização e renderização o tempo limite de 16,66666 Milissegundos é superado, então temos uma queda na taxa de 60FPS, caso contrário, podemos até ter um aumento na taxa, quem sabe indo para 72FPS.

O projeto com o código apresentado pode ser baixado aqui.

Comentários

Postar um comentário

Postagens mais visitadas deste blog

Colisões Bounding Box

Imagem
Bounding Box conhecido como bbox é uma técnica em que é feito o uso de retângulos para detectar colisões. Nos jogos 2D, essa técnica consiste em delimitar a área dos objetos do jogo através de retângulos, conhecido como retângulos de colisão. Existem dois tipos de bbox , o orientado e o alinhado aos eixos. O primeiro conhecido como obbox(Oriented Bounding Box) trata de colisões em que o objeto esteja rotacionado. Já o segundo tipo, conhecido como aabb(Axis-Aligned Bounding Box) trata de colisões em que o objeto não está rotacionado. Nesse artigo trataremos do aabb . A Imagem 1 mostra um cenário em que o jogador tenta coletar uma moeda. Imagem 1 criada através das imagens disponibilizadas por kenney , surt e por Tio Aimar . Acesso em 07/12/2017. Note a presença dos retângulos de colisão no personagem e nas três primeira moedas. Na maioria das vezes, um objeto com apenas um retângulo de colisão será suficiente, mas quando não for, poderá ser utilizado mais retângu...
Leia mais

Mapas em Jogos 2D - Parte I

Imagem
Mapas em jogos 2D é construído através do uso de matrizes. No segundo ano do Ensino Médio é ensinado o conceito de matrizes, que nada mais é que uma estrutura que serve para apresentar ou representar dados em forma de tabela, linhas e colunas. Em jogos 2D podemos fazer a mesma coisa, criar uma matriz que representa o mapa do jogo. A Imagem 1 mostra um exemplo de como representar um mapa 2D através de matrizes. Imagem 1 A Imagem 1 ilustra o uso de matrizes em jogos 2D, sendo a declaração do mapa feita em JavaScript. Nesse mapa os zeros poderiam representar espaços vazios, enquanto que os números  1  poderiam representar um terreno ou uma plataforma. Observe também, que a construção do mapa é feita através de um array de duas dimensões, o que significa que na linha 0 temos o array [0, 0, 0, 0, 0], enquanto que na linha 1 temos o array [1, 0, 0, 0, 0] e por aí vai. Para acessar uma célula no mapa é preciso informa a linha e a coluna. Por exemplo, ao acessar a linha...
Leia mais