Un jeu écrit en HTML5 fonctionnera-t-il sur les smartphones?

Je voudrais écrire un jeu qui pourrait être joué sur des téléphones intelligents et je me demandais si HTML5 pourrait être un moyen d'écrire des jeux pour fonctionner sur une large sélection de téléphones intelligents.

Je viens de lancer le test HTML5 :

• Mon iPod Touch 2e génération avec iOS 3.1.3 obtient 125 et 7 points bonux sur 300 dans Safari. À noter en particulier pour le développement de jeux:
  • Plein de points dans Canvas! Idéal pour le rendu de jeu.
  • Prend en charge l'élément vidéo aux formats MPEG-4 et H.264
  • Prend en charge l'élément audio avec les formats PCM, MP3 et AAC (idéal pour le bgm et les sons!)
  • Les stockages locaux et de session sont pris en charge, tout comme la base de données Web SQL! (fichiers de sauvegarde du jeu?)
  • Le cache d'application est pris en charge; Je suppose que cette fonctionnalité vous permettra de mettre en cache les fichiers de données de jeu (images et autres) pour un chargement plus rapide. Ça me semble génial!
  • Pas de support WebGL.
  • Pas de WebSocket non plus; les jeux multijoueurs devront utiliser autre chose que le sondage AJAX.
• My Droid Incredible avec Android OS 2.1 (+ Sense UI) marque 151 et aucun point bonus sur 300 sur son navigateur intégré. Encore une fois, à noter en particulier:
  • Prise en charge complète de Canvas
  • élément vidéo pris en charge, mais les quatre codecs avaient des X sur eux. Je me demande quels formats il peut jouer?
  • élément audio, même chose que la vidéo - pris en charge, mais les formats ont tous des X.
  • Session et stockage local et Web SQL Database tous pris en charge
  • Le cache d'application est pris en charge
  • Pas de WebGL ou WebSocket
  • Les travailleurs Web sont pris en charge, ce qui n'était pas le cas sur mon iPod; cela pourrait être une bonne chose dans le développement de jeux pour des choses qui agissent en parallèle - peut-être l'IA?
• Edit 18/01/2011: My Droid Incredible a maintenant Android 2.2 et marque 176 sur 300. Tchalvak (dans les commentaires) a obtenu le même score avec son Droid 2, il semble donc être courant pour le navigateur Android 2.2. J'ai également essayé le navigateur Opera Mobile qui a obtenu un terrible 72 (pas de points bonus) sur 300, mais supporte pleinement la toile!

Donc, comme vous pouvez le voir, l'iPod / iPhone et Android sont au coude à coude et semblent prendre en charge une gamme décente de fonctionnalités HTML5. Canvas est idéal pour les graphiques de navigateur 2D et l'élément audio serait probablement idéal pour lire des sons et de la musique de fond, et il est également très cool de voir que les deux plates-formes prennent en charge le stockage (bien que vous puissiez toujours utiliser des cookies bien sûr, selon la taille de une sauvegarde de jeu). Donc, dans l'ensemble, je dirais que vous devriez y aller. Les chiffres ne sont pas tout; comme l'a dit wkerslake "aucun de ces chiffres n'inspire confiance" mais si vous regardez à travers ce qui est pris en charge, il semble être tout ce dont vous avez besoin!

Je dis allez-y! Je vous souhaite bonne chance.

Au fait, vous voudrez peut-être surveiller Vanthia . C'est un jeu par navigateur qui utilise la toile pour un dessin efficace. J'ai pu jouer la bêta fermée et c'était sûr! Le développeur en dit très peu depuis plus de six mois maintenant, sauf qu'il le développe définitivement mais garde les choses quelque peu secrètes.

Vous pouvez également obtenir des idées du récent logo interactif Pacman de Google . Ce n'était pas très HTML5 mais c'était fonctionnel! Cela montre que vous n'avez pas vraiment besoin de HTML5 pour créer un jeu par navigateur (et je pense que HTML5 est trop utilisé comme mot à la mode, tout comme AJAX était ou est toujours). Il existe un projet github avec une version désobfusquée et nettoyée de la source avec laquelle vous pouvez regarder et jouer.

HTML5 est loin d'être pris en charge de manière omniprésente, même dans les navigateurs Web sur PC, et encore moins sur les téléphones.

Ces chiffres sont basés sur le html5test

• IE8 sur PC = 27/300
• Chrome 5.0.375.125 sur PC = 197/300
• Safari 4.0.4 sur PC = 207/300
• Safari sur iPhone4 = 185/300

Aucun de ces chiffres n'inspire confiance

Cela peut sembler un peu tard, mais je voudrais fournir une mise à jour sur la situation de HTML5 et des navigateurs mobiles maintenant qu'un certain temps s'est écoulé. Dernièrement, plusieurs moteurs de jeu ont été développés pour produire des jeux compatibles HTML5 (voir: Construct 2 et Game Maker Studio ). Les deux produisent des performances OK mais il y a eu des problèmes notables avec les extensions physiques et les objets en mouvement rapide sur certaines plates-formes. iOS prend toujours les devants en matière de performances, mais Android a parcouru un long chemin avec les dernières versions de Chrome. Il convient de noter que Dolphin Browser sur Android augmente même de 100% les performances HTML5! Vous pouvez voir une comparaison rapide effectuée pour un test ci-dessous:

Si vous cherchez à faire une optimisation manuelle, voici d' excellents conseils répertoriés ici . De plus, avec les jeux HTML5 devenant de plus en plus populaires et autorisés sur des sites comme Kongregate et auparavant d'autres portails de jeux exclusifs flash - il n'y a plus aucune raison d'avoir peur d'écrire des jeux basés sur HTML5 pour un appareil mobile.

Quelques bibliothèques existent également pour garder les choses faciles à utiliser sur mobile, j'en ai énuméré quelques-unes ci-dessous:

KineticJS

EaselJS

QuarkJS

à partir de juillet 2012, vous pouvez créer des jeux HTML5 mobiles fluides. Découvrez cette vidéo

Du point de vue technique, c'est certainement faisable. Il y a cependant quelques problèmes / pièges:

• Il n'y a pas beaucoup de frameworks à l'air libre, vous devrez donc tout écrire à partir de zéro. Du moteur de rendu au traitement du son en passant par la détection de collision. Cela peut représenter beaucoup de travail, selon ce que vous essayez de faire.
• Vous devrez avoir une très bonne compréhension de JavaScript. Certaines pratiques OOP habituelles ne fonctionneront pas lors de l'utilisation de ce langage. Ce n'est probablement pas le meilleur choix pour un jeu avec d'énormes quantités de code :)
• N'oubliez pas la performance. Les smartphones sont loin des performances d'un PC de bureau classique. Vous devrez tester soigneusement les performances sur différents appareils. Cela peut également dépendre du moteur JavaScript (navigateur) installé sur l'appareil. Bien sûr, ce n'est pas uniquement un problème HTML5.
• Essayez de réduire la bande passante nécessaire au jeu. Les appareils mobiles ont tendance à avoir des connexions plus lentes et parfois les gens paient pour la bande passante qu'ils utilisent. Essayez d'utiliser la mise en cache autant que possible.

J'ai trouvé un bon article sur iPad et HTML5: http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/

De plus, j'éviterais de dessiner sur toile sur iPad, pour une raison quelconque, cela semble assez lent.

Vous pouvez utiliser PhoneGap Build :

Téléchargez simplement un fichier zip avec le code HTML5 et il vous donnera l'application pour: Android, iOS, winphone, Blackbarry, Symbian ..ecc ..