Canvas vs SVG pour les jeux
Je me rends compte qu'il existe de nombreux tutoriels et sites et tout ce qui répond "Quel est le meilleur pour les applications de jeux?" Ils disent tous que SVG n'est pas adapté aux applications de jeu, c'est le canevas. Mais cela m'embrouille.
- Une fois que quelque chose est dessiné sur la toile, il est oublié.
- Les éléments SVG peuvent être modifiés après la création, sans toucher à aucun autre élément visuel du jeu.
- Le canevas n'a pas d'animation intégrée
- SVG a intégré des animations
Alors disons que je fais un jeu de plateforme. Je veux que le personnage principal traverse la scène avec un arrière-plan magnifiquement peint. Dans Canvas, je dois soit recréer l'intégralité de sa hitbox (repeindre l'endroit de chaque entité en mouvement), soit créer un élément canvas séparé et utiliser peut-être ctxChar, ctxBG, ctxItems etc. Avec SVG, en revanche, il est intégré. Et je peux même simplement mettre un <animate> tag à l'intérieur de son <use> tag qui modifie sa position x (ou la modifie manuellement via js), et une autre <animate> tag pour changer son Sprite. Et puis l'arrière-plan ne doit jamais être touché.
En ce qui concerne l'animation simultanée d'un tas d'éléments, je ne vois pas comment cela est plus rapide dans Canvas qu'en SVG. Quel est le problème avec la mise en éléments svg dans des groupes? Peut-il être plus lent que de redessiner les arrière-plans des hitbox et de redessiner les entités elles-mêmes pour toutes les entités?
Edit: Je pense que ma vraie question n'est pas de savoir si SVG pourrait fonctionner, mais pourquoi les gens pensent que cela ne pourrait pas.
Toile SVG V
En tant que créateur de jeux professionnel, mon conseil est de rester loin de SVG si vous souhaitez créer des jeux basés sur un navigateur. La raison principale est qu'elle est tout simplement trop lente. La deuxième raison est que cela rendra votre travail de programmeur plus difficile, car il est difficile de trouver des solutions au manque de performances de SVG. Troisième raison, car elle est TRÈS LENTE et les jeux sont axés sur les performances.
Cette page passera en revue la conception de jeux SVG ne approche originale du développement de jeux Web utilisant SVG mais avant de plonger et de lire tout cela, jetez un œil au prototype du jeu, il s'agit de - Prototype de runes et reliques . Un peu oh hum dans mon livre.
Je suis sûr qu'il y a d'autres tentatives, c'était juste la première fois dans ma recherche. Mais je n'ai jamais joué un bon jeu SVG.
Alors, à quoi sert SVG? Ressources graphiques. SVG est un bon moyen de regrouper des images pour votre jeu. Une fois que vous les avez sur le client, vous pouvez les rendre sur des bitmaps, puis les utiliser pour rendre votre jeu. La beauté est que vous obtenez l'évolutivité indépendante de la résolution de [~ # ~] s [~ # ~] VG et de petites images. Mais en les rendant en bitmap au moment du chargement, vous obtenez la pleine utilisation du GPU pour déplacer les pixels. SVG est tout simplement trop lent à utiliser dans le jeu.
Pourquoi utiliser Canvas? Je voudrais dire parce que c'est rapide, mais ce n'est pas lorsque vous le comparez à une application C++ native qui fonctionnera 10 * plus rapidement que le jeu Javascript/canvas équivalent. Dix fois plus vite, c'est très important, mais vous n'obtenez pas l'avantage multiplateforme que vous obtenez avec Javascript.
Actuellement, canvas est la meilleure option pour les applications de jeux vraiment multi-plateformes. En utilisant WebGL 2D ou 3D, vous pouvez créer des jeux plein écran en plein taux d'images. HTML5 possède un bon ensemble d'API pour tous les besoins de jeu et est facile à apprendre.
Je ne suis pas un fan des moteurs de jeux, ils sont une solution globale, l'homme intermédiaire entre vous et les API déjà bien conçues qui vous obligent à le faire à leur manière (pas si géniale). Mais ils vous donneront un bon aperçu de ce qui est possible.
Phaser est un moteur de jeu en toile javascript qui a beaucoup de ressources et d'exemples. C'est un bon endroit pour commencer et voir ce qui peut être fait. Ne soyez pas aspiré par le fait que les moteurs de jeux se vendent comme tels. HTML5 et JavasScript sont prêts à l'emploi le meilleur moteur de jeu de la ville, exécutent du code natif, ont une énorme base d'utilisateurs et de support. Le temps que vous passerez à apprendre à utiliser l'API d'un moteur de jeu ne sera pas consacré à apprendre à utiliser les API HTML5 (et, franchement, les API HTML5 sont parfaites, le résultat des guerres de navigateur de 20 ans), ce qui est en fait plus facile que le jeu. moteurs à utiliser et à apprendre.