Développer un jeu avec Javascript et Canvas : The no tears way

[Maks]

Pas du tout, je note juste une bonne perte de FPS sur mon jeu sous Chrome à cause de ça

A propos du multi canvas : http://jsperf.com/multicanvas

[Seby63]

Voilà un petit test de rendu avec :
- Dessiné les tiles a chaque boucle sur le canvas principal
- Dessiné toute les tiles sur un buffer, puis copie de ce buffer sur le canvas principal

http://jsperf.com/canvas-drawtiles-vs-canvas-drawbuffer

Je vous laisse voir ça pas vous même

[niahoo]

... utiliser prototype plutôt que les closures ...

Est-ce que ça change grand chose au niveau des performances autres que l'utilisation de mémoire ?

[Maks]

Voilà un petit test de rendu avec :
- Dessiné les tiles a chaque boucle sur le canvas principal
- Dessiné toute les tiles sur un buffer, puis copie de ce buffer sur le canvas principal

http://jsperf.com/canvas-drawtiles-vs-canvas-drawbuffer

Je vous laisse voir ça pas vous même

Le résultat est sans appel, mais on notera comme je disais la perte de perf lorsque le canvas devient grand :/
Aussi lorsque tu génères un buffer au chargement de ton jeu, ça va, mais lorsque tu dois en générer un à la volée, c'est pas la joie (surtout sous IE). Obligé de créé un noeud du DOM pour avoir un canvas (new Canvas() impossible), une manipulation qui coute cher (le genre de truc qui provoque une baisse soudaine de FPS).

---

... utiliser prototype plutôt que les closures ...

Est-ce que ça change grand chose au niveau des performances autres que l'utilisation de mémoire ?

Niveau perf c'est mieux les prototypes (faudrait retrouver le benchmark mais c'est facilement reproductible), surtout c'est le way to go en Javascript

[Seby63]

Je suis actuellement en train de revoir totalement le script que j'ai mis en ligne il y a quelques temps.

La révision va se faire sous forme de framework. La majorité des canvas et buffer se feront au chargement de la page donc ça limitera les pertes de FPS.

Par contre on vois bien que Opéra n'est pas encore super au point au niveau des canvas.

En ce qui concerne mon développement de framework, j'ai d'ailleurs aussi un soucis avec opéra et les objets au cours de leurs créations je ne sais pas vraiment pourquoi... Il n'arrive pas a récupéré les valeurs modifier après construction même dans la boucle principal du jeu.

[Maks]

Tu as testé la toute dernière version de Opera ? Il me semble qu'ils en ont sorti une nouvelle

[Seby63]

En effet, il existe une version 15 (Opéra next). J'ai fait un test : http://jsperf.com/canvas-drawtiles-vs-canvas-drawbuffer

Et c'est quand même meilleurs. Mais bon c'est tout de même pas terrible. Du tout la nouvelle version a corrigé mon problème avec ma POO.

[Maks]

Ok
Souvent les meilleures perfs pour canvas sont sous Firefox et Chrome. Les autres sont assez à la ramasse

[Seby63]

Oui c'est bien ce que j'ai pu voir. D'ailleurs, je pense que je vais utilise colliejs : http://jindo.dev.naver.com/collie/index.html

Pour mes rendu. Ce framework est quand même énorme niveau performance!

http://jsperf.com/canvas-lib-render/14

[Maks]

Je ne connais pas, je vais jeter un coup d'oeil
Si je devais refaire un moteur de jeu aujourd'hui je prendrais un framework WebGL qui fallback vers canvas (three.js ou pixi.js)
oxman avait linké Turbulenz, ça a l'air excellent mais je me demande si c'est surtout pas du aux designers qui sont bons