Double mise en mémoire tampon sur le jeu HTML5 Canvas?

23

Mon jeu de toile simple semble bien fonctionner sur Chrome et FF sur Mac / Linux. Je n'ai pas encore eu l'occasion de le tester sur des smartphones ou des environnements Windows. Il n'utilise pas la double mise en mémoire tampon, mais j'ai vu quelques exemples de toile JS l'utiliser.

Quand est-il recommandé d'utiliser la double mise en mémoire tampon? Cela fait-il une différence uniquement pour des navigateurs spécifiques? Y a-t-il un impact significatif sur les performances?

Merci!

javascript html5 html-canvas double-buffering Petteri Hietavirta
la source
2
OT: ce jeu de règles, c'est très prometteur, bon travail (souvent il faut travailler beaucoup plus sur l'interface, certaines choses ne sont pas claires, etc.)
o0 '.
C'est en effet assez sucré. Recommandation cependant: mappez le niveau sur autre chose que l'espace. Un peu ennuyeux de voir la fenêtre de mon navigateur défiler à chaque fois.
michael.bartnett
n'utilisez pas non plus les touches fléchées pour la direction .. je suis actuellement en mode sans échec et sur un petit écran, il continue de défiler partout ... fyi: p
Tor Valamo
Je pense qu'il est possible de capturer des clés afin que les fenêtres du navigateur n'agissent pas sur elles.
AttackingHobo
Merci! A, W, D et retournez également au travail maintenant. Envoyez un tweet à momentumracer ou envoyez un courriel à [email protected] pour d'autres commentaires ou idées afin que cela ne devienne pas un forum de discussion :-).
Petteri Hietavirta

Réponses:

15

La double mise en mémoire tampon d'un jeu basé sur une toile sera certainement un succès de performance. Vous dessineriez une quantité supplémentaire de pixels égale à la taille de votre toile à chaque image. Dans les jeux basés sur le canevas, dessiner sur un canevas est le plus gros goulot d'étranglement dans la plupart des cas et vous souhaitez limiter cela autant que possible, en particulier sur les appareils mobiles.

Chrome a une accélération GPU (à partir des dernières versions) ainsi qu'un moteur JavaScript rapide (V8) méchant que vous ne verrez pas correspondre dans un environnement mobile. Même dans Chrome, vous constaterez un ralentissement en mettant en œuvre une double mise en mémoire tampon.

Pour faire court, l'avantage de la double mise en mémoire tampon (traitant de la "déchirure") ne vaut pas le coup de performance que vous prendrez très probablement.

Geoff
la source
1
Cependant, lorsque vous remarquez un scintillement ou quelque chose de similaire, un double tampon résoudra probablement cela. Pour répondre à votre question: Si vous remarquez un scintillement, je suggère d'utiliser un double tampon. Sinon, il n'y a pas de raison non plus. Notez qu'un double tampon est facile à implémenter ou à supprimer (au cas où vous remarqueriez que la perte de performances l'emporte sur le scintillement).
user8363
1

J'ai remarqué que l'utilisation de la double mise en mémoire tampon comme ceci:

  1. dessine tout une toile invisible
  2. copier la toile invisible sur la vraie toile

ralentit en fait le rendu (fps inférieurs), au lieu de l'accélérer

Lune argentée
la source