Czy gra napisana przy użyciu HTML5 będzie działać na smartfonach?

Chciałbym napisać grę, w którą można grać na smartfonach i zastanawiałem się, czy HTML5 może być sposobem na pisanie gier do pracy na szerokiej gamie smartfonów.

Właśnie uruchomiłem test HTML5 :

• Mój iPod Touch 2. generacji z iOS 3.1.3 uzyskuje 125 i 7 punktów bonusowych na 300 w Safari. Szczególną uwagę na rozwój gier:
  • Pełne punkty w kanwie! Idealne do renderowania gier.
  • Obsługuje element wideo w formatach MPEG-4 i H.264
  • Obsługuje element audio w formatach PCM, MP3 i AAC (doskonały dla bgm i dźwięków!)
  • Obsługiwane są sesje i lokalne magazyny, podobnie jak Web SQL Database! (zapisywanie plików gry?)
  • Obsługiwana jest pamięć podręczna aplikacji; Zakładam, że ta funkcja umożliwia buforowanie plików danych gry (obrazów itp.) W celu szybszego ładowania. Brzmi świetnie dla mnie!
  • Brak obsługi WebGL.
  • Brak WebSocket; gry wieloosobowe będą musiały używać czegoś innego, jak odpytywanie AJAX.
• My Droid Incredible z systemem Android OS 2.1 (+ Sense UI) zdobywa 151 punktów i nie ma punktów bonusowych na 300 we wbudowanej przeglądarce. Ponownie, szczególną uwagę:
  • Pełna obsługa Canvas
  • element wideo jest obsługiwany, ale wszystkie cztery kodeki miały na sobie litery X. Zastanawiam się, jakie formaty można odtwarzać?
  • element audio, to samo co obsługiwane wideo, ale wszystkie formaty mają X-y.
  • Obsługiwana jest sesja i pamięć lokalna oraz baza danych Web SQL
  • Obsługiwana jest pamięć podręczna aplikacji
  • Brak WebGL lub WebSocket
  • Obsługiwani są pracownicy sieci, którzy nie byli obsługiwani na moim iPodzie; może to być dobra rzecz w tworzeniu gier dla rzeczy, które działają równolegle - może AI?
• Edytuj 2011/1/18: Mój Droid Incredible ma teraz Androida 2.2 i otrzymuje wynik 176 na 300. Tchalvak (w komentarzach) uzyskał ten sam wynik na swoim Droidie 2, więc wydaje się, że jest to powszechne w przeglądarce Androida 2.2. Wypróbowałem również przeglądarkę Opera Mobile, która otrzymała straszne 72 (bez punktów bonusowych) z 300, ale w pełni obsługuje płótno!

Jak widać, iPod / iPhone i Android są bardzo popularne i wydają się obsługiwać przyzwoity zakres funkcji HTML5. Płótno doskonale nadaje się do grafiki w przeglądarce 2D, a element audio byłby prawdopodobnie świetny do odtwarzania dźwięków tła i muzyki, a także naprawdę fajnie jest widzieć, że obie platformy obsługują przechowywanie (chociaż zawsze można po prostu używać plików cookie, w zależności od wielkości zapis gry). Więc ogólnie powiedziałbym, że powinieneś to zrobić. Liczby to nie wszystko; jak powiedział wkerslake „żadna z tych liczb nie budzi zaufania”, ale jeśli spojrzysz na to, co jest obsługiwane, wydaje się, że jest to wszystko, czego potrzebujesz!

Mówię idź po to! Życzę powodzenia.

Nawiasem mówiąc, możesz chcieć uważać na Vanthię . To gra przeglądarkowa, która wykorzystuje płótno do wydajnego rysowania. Musiałem zagrać w zamkniętą wersję beta i na pewno nadejdzie! Deweloper od ponad pół roku mówi niewiele, poza tym, że zdecydowanie go rozwija, ale po prostu zachowuje tajemnicę.

Możesz również uzyskać pomysły z najnowszego interaktywnego logo Google Pacman . Nie był bardzo HTML5, ale z pewnością działał! To pokazuje, że tak naprawdę nie potrzebujesz HTML5 do stworzenia gry na przeglądarkę (i myślę, że HTML5 jest zbyt często używany jako modne hasło, tak jak AJAX było lub nadal jest). Istnieje projekt github z odszyfrowaną, oczyszczoną wersją źródła, którą możesz przeglądać i bawić się.

HTML5 to daleka droga od wszechobecnego wsparcia, nawet w przeglądarkach internetowych na PC, znacznie mniej telefonów.

Te liczby są oparte na teście HTML5

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

Żadna z tych liczb nie budzi zaufania

Może się to wydawać trochę późno, ale chciałbym przedstawić aktualizację sytuacji HTML5 i przeglądarek mobilnych, gdy minęło trochę czasu. Ostatnio opracowano kilka silników gier, które będą produkować gry zgodne z HTML5 (patrz: Construct 2 i Game Maker Studio ). Obie produkują OK, ale wystąpiły znaczące problemy z rozszerzeniami fizyki i szybko poruszającymi się obiektami na niektórych platformach. iOS nadal przoduje, jeśli chodzi o wydajność, ale Android przeszedł długą drogę dzięki najnowszym kompilacjom Chrome. Należy zauważyć, że Dolphin Browser na Androida zapewnia nawet 100% wzrost wydajności HTML5! Poniżej możesz zobaczyć szybkie porównanie wykonane dla testu :

Jeśli szukasz zrobić ręcznej optymalizacji, jest jakaś wielka rada wymienione tutaj . Ponieważ gry HTML5 stają się coraz bardziej popularne i dozwolone w witrynach takich jak Kongregate i wcześniej inne portale z grami flashowe - nie ma powodu, aby bać się pisać gry oparte na HTML5 na urządzenia mobilne.

Istnieje również kilka bibliotek, które ułatwiają korzystanie z urządzeń mobilnych, wymieniłem kilka poniżej:

KineticJS

Sztaluga JS

QuarkJS

od lipca 2012 r. możesz tworzyć płynne mobilne gry HTML5. Sprawdź ten film

Z technicznego punktu widzenia jest to z pewnością wykonalne. Istnieją jednak pewne problemy / pułapki:

• Na zewnątrz nie ma zbyt wielu ram, więc będziesz musiał pisać wszystko od zera. Od renderera, po obsługę dźwięku, wykrywanie kolizji. To może być dużo pracy, w zależności od tego, co próbujesz zrobić.
• Musisz naprawdę dobrze rozumieć JavaScript. Niektóre zwykłe praktyki OOP nie będą działać podczas korzystania z tego języka. Prawdopodobnie nie jest to najlepszy wybór dla gry z dużą ilością kodu :)
• Nie zapomnij o wydajności. Smartfony są dalekie od wydajności typowego komputera stacjonarnego. Będziesz musiał dokładnie przetestować wydajność na różnych urządzeniach. Może to również zależeć od silnika JavaScript (przeglądarki) zainstalowanego na urządzeniu. Oczywiście nie jest to tylko kwestia HTML5.
• Spróbuj zmniejszyć przepustowość potrzebną do gry. Urządzenia mobilne mają zwykle wolniejsze połączenia i czasami ludzie płacą za przepustowość, z której korzystają. Staraj się używać buforowania, gdy tylko jest to możliwe.

Znaleziono dobry post na temat iPada i HTML5: http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/

Unikałbym również rysowania ciężkiego płótna na iPadzie, z jakiegoś powodu wydaje się to dość powolne.

Możesz użyć PhoneGap Build :

Wystarczy załadować plik zip z kodem HTML5, a otrzymasz aplikację na: Android, iOS, winphone, Blackbarry, Symbian ..ecc ..