Funktioniert ein mit HTML5 geschriebenes Spiel auf Smartphones?

Ich möchte ein Spiel schreiben, das auf Smartphones gespielt werden kann, und habe mich gefragt, ob HTML5 eine Möglichkeit ist, Spiele für eine große Auswahl von Smartphones zu schreiben.

Ich habe gerade den HTML5-Test ausgeführt :

• Mein iPod Touch der zweiten Generation mit iOS 3.1.3 erhält in Safari 125 und 7 Bonuspunkte von 300. Besonders wichtig für die Spieleentwicklung:
  • Volle Punkte in Canvas! Ideal für das Rendern von Spielen.
  • Unterstützt das Videoelement mit den Formaten MPEG-4 und H.264
  • Unterstützt das Audio-Element mit den Formaten PCM, MP3 und AAC (ideal für BGM und Sounds!)
  • Session- und lokale Speicher werden ebenso unterstützt wie die Web SQL-Datenbank! (Spiel speichern Dateien?)
  • Anwendungs-Cache wird unterstützt. Ich gehe davon aus, dass Sie mit dieser Funktion Spieledatendateien (Bilder usw.) für ein schnelleres Laden zwischenspeichern können. Hört sich toll an für mich!
  • Keine WebGL-Unterstützung.
  • Auch kein WebSocket; Multiplayer-Spiele müssen etwas anderes wie AJAX-Polling verwenden.
• My Droid Incredible mit Android OS 2.1 (+ Sense UI) erhält 151 Punkte und in seinem eingebauten Browser keine Bonuspunkte von 300. Nochmals von besonderer Bedeutung:
  • Volle Canvas-Unterstützung
  • Videoelement unterstützt, aber alle vier Codecs haben X-Zeichen. Ich frage mich, welche Formate es abspielen kann?
  • Audioelement, dasselbe wie Video - unterstützt, aber alle Formate haben ein X.
  • Sitzungs- und lokaler Speicher sowie Web SQL-Datenbank werden unterstützt
  • Anwendungs-Cache wird unterstützt
  • Kein WebGL oder WebSocket
  • Es werden Web-Worker unterstützt, die auf meinem iPod nicht unterstützt wurden. Dies könnte eine gute Sache in der Spieleentwicklung für Dinge sein, die parallel agieren - vielleicht KI?
• Edit 18.01.2011: My Droid Incredible hat jetzt Android 2.2 und erzielt 176 von 300 Punkten. Tchalvak (in den Kommentaren) hat mit seinem Droid 2 die gleiche Punktzahl, so dass es für den Android 2.2-Browser üblich zu sein scheint. Ich habe auch den Opera Mobile-Browser ausprobiert, der schreckliche 72 (keine Bonuspunkte) von 300 erreicht hat, aber Canvas voll unterstützt!

Wie Sie sehen können, sind iPod / iPhone und Android sehr eng miteinander verbunden und scheinen eine ganze Reihe von HTML5-Funktionen zu unterstützen. Canvas eignet sich hervorragend für Grafiken in 2D-Browsern, und das Audioelement eignet sich wahrscheinlich hervorragend für die Wiedergabe von Hintergrundgeräuschen und Musik. Außerdem ist es sehr cool zu sehen, dass beide Plattformen Speicher unterstützen (obwohl Sie je nach Größe von natürlich immer nur Cookies verwenden können ein Spiel speichern). Insgesamt würde ich sagen, dass Sie sich dafür entscheiden sollten. Die Zahlen sind nicht alles; wie wkerslake sagte "keine dieser zahlen schafft vertrauen" aber wenn man durchschaut was unterstützt wird, scheint es alles zu sein was man braucht!

Ich sage, mach schon! Ich wünsche Ihnen viel Glück.

Übrigens möchten Sie vielleicht nach Vanthia Ausschau halten . Es ist ein Browsergame, das Canvas für effizientes Zeichnen verwendet. Ich durfte die Closed Beta spielen und es war mir sicher, dass ich mitmachen konnte! Der Entwickler sagt seit über einem halben Jahr sehr wenig, abgesehen davon, dass er es definitiv entwickelt, aber die Dinge nur etwas geheim hält.

Sie könnten auch einige Ideen aus Googles neuem interaktiven Pacman- Logo erhalten. Es war nicht sehr HTML5, aber es war sicher funktionsfähig! Es zeigt, dass Sie eigentlich kein HTML5 benötigen, um ein Browsergame zu erstellen (und ich denke, HTML5 wird viel zu sehr als Schlagwort herumgeworfen, genauso wie AJAX es war oder immer noch ist). Es gibt ein Github-Projekt mit einer deobfuscierten, bereinigten Version der Quelle, die Sie durchsehen und mit der Sie spielen können.

HTML5 ist weit davon entfernt, allgegenwärtig unterstützt zu werden, selbst in Webbrowsern auf PCs, bei denen es sich um weniger Telefone handelt.

Diese Zahlen basieren auf dem HTML5-Test

• IE8 auf PC = 27/300
• Chrome 5.0.375.125 auf PC = 197/300
• Safari 4.0.4 auf dem PC = 207/300
• Safari auf dem iPhone 4 = 185/300

Keine dieser Zahlen stiftet Vertrauen

Es mag etwas spät erscheinen, aber ich möchte jetzt, da einige Zeit vergangen ist, ein Update zur Situation von HTML5 und den mobilen Browsern bereitstellen. In letzter Zeit wurden einige Spiele-Engines entwickelt, die HTML5-kompatible Spiele produzieren (siehe: Construct 2 und Game Maker Studio ). Beide liefern eine gute Leistung, aber es gab auf einigen Plattformen bemerkenswerte Probleme mit physischen Erweiterungen und sich schnell bewegenden Objekten. iOS ist immer noch führend, wenn es um Leistung geht, aber Android hat mit den neuesten Chrome-Builds einen langen Weg zurückgelegt. Es sollte beachtet werden, dass Dolphin Browser auf Android die HTML5-Leistung sogar um 100% steigert! Unten sehen Sie einen schnellen Vergleich für einen Test :

Wenn Sie eine manuelle Optimierung durchführen möchten, finden Sie hier einige gute Ratschläge hier . Da HTML5-Spiele immer beliebter werden und auf Websites wie Kongregate und anderen exklusiven Flash-Spieleportalen zugelassen sind, besteht kein Grund mehr, sich davor zu fürchten, HTML5-basierte Spiele für mobile Geräte zu schreiben.

Es gibt auch einige Bibliotheken, um die Verwendung auf Mobilgeräten zu vereinfachen. Im Folgenden sind einige aufgeführt:

KineticJS

EaselJS

QuarkJS

Ab Juli 2012 können Sie reibungslose HTML5-Spiele für Mobilgeräte erstellen. Schauen Sie sich dieses Video an

Aus technischer Sicht ist das durchaus machbar. Es gibt jedoch einige Probleme / Fallstricke:

• Es gibt nicht viele Frameworks im Freien, so dass Sie im Grunde alles von Grund auf neu schreiben müssen. Vom Renderer bis zur Geräuschbehandlung und Kollisionserkennung. Dies kann eine Menge Arbeit sein, je nachdem, was Sie versuchen zu tun.
• Sie müssen ein wirklich gutes Verständnis von JavaScript haben. Einige der üblichen OOP-Methoden funktionieren mit dieser Sprache nicht. Es ist wahrscheinlich nicht die beste Wahl für ein Spiel mit riesigen Mengen an Code :)
• Vergiss die Leistung nicht. Smartphones sind weit von der Leistung eines typischen Desktop-PCs entfernt. Sie müssen die Leistung auf verschiedenen Geräten sorgfältig testen. Dies kann auch von der auf dem Gerät installierten JavaScript-Engine (Browser) abhängen. Dies ist natürlich nicht nur eine HTML5-Ausgabe.
• Versuchen Sie, die für das Spiel benötigte Bandbreite zu reduzieren. Mobile Geräte haben in der Regel langsamere Verbindungen und manchmal zahlen die Benutzer für die von ihnen genutzte Bandbreite. Versuchen Sie, wann immer möglich, Caching zu verwenden.

Einen guten Beitrag zu iPad und HTML5 gefunden: http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/

Außerdem würde ich schweres Zeichnen auf dem iPad vermeiden, aus irgendeinem Grund scheint es ziemlich langsam zu sein.

Sie können PhoneGap Build verwenden :

Laden Sie einfach eine Zip-Datei mit dem HTML5- Code hoch und Sie erhalten die Anwendung für: Android, iOS, Winphone, Blackbarry, Symbian ..ecc ..