„Az összevisszaságban találd meg az egyszerűséget, a hangzavarban a harmóniát...”

Archon

A játékátirat: http://archon.krissz.hu/
Követelmény: Chrome 48+ vagy Firefox 42+, és a <canvas> elem hardveres gyorsítására képes videókártya.

Pár évvel ezelőtt azt mondtam, hogy valós idejű hálózati játékokra egyelőre még alkalmatlanok a böngészők. Nem kellett sokat várni arra, hogy a korlátok lebomoljanak, és habár még mindig nem triviális a dolog, és a támogatottsága sem teljeskörű, de már ki lehet jelenteni, hogy a böngészők alkalmasak a minimális késleltetéses "agyatlan lövöldözés" megvalósítására.

A WebRTC egy olyan projekt, ami a böngészős és egyéb mobil alkalmazások valós idejű kommunikációját hivatott megoldani, köztes szerver nélkül, peer-to-peer módon. Ahogy én tapasztaltam, főleg a képi- és hangüzenetek folyamatos streamelésén lehetett a hangsúly a projekt alapjainak lefektetésekor. Viszont ha kép és hang át tud menni valós időben, élő videochatet képezve, akkor a hálózati játékok jóval csekélyebb adatmennyiségének átvitele is működik, nemde?

Archon táblaA neten példaprogramokat keresve többnyire csak száraz techdemókat találtam, ahol a progi egy textareába kiírja hogy Hello world!, te meg hidd el, hogy ez most egy real-time üzenet volt. Épp ezért ismét úgy döntöttem, hogy az unalmas szakmázás helyett egy élvezetes és szórakoztató útját választom a technológia bemutatásának. És mi lehet élvezetesebb és szórakoztatóbb, mint az Archon-t hálózatban játszani a haverral, webböngészőn keresztül, egy kattintásra? Ráadásul teljesen véletlenül belefutottam egy internetes petícióba is, ami pontosan ezt a kívánságot foglalta magába, és intézte egyenesen hozzám, úgyhogy megduplázott lendülettel vágtam bele.

A feladat megvalósítása három részből állt. Meg kellett írni az offline játékot, azt ki kellett bővíteni az online játékhoz szükséges, felek közötti adatcsere logikájával, illetve meg kellett valósítani a hálózati kapcsolati réteg technikai működését.

Az offline játék megírása jelentette számomra a legnagyobb örömöt. Megfigyelni az eredeti játék minden rezdülését, rájönni annak rejtett összefüggéseire olyan, mint felfedezni egy új kontinenst. Amikor kitisztul egy addig homályos ködbe burkolózó világ. Eredeti forráskódokat, memória dumpokat most sem használtam fel, teljesen a nulláról íródott. A kivagdosott grafikai- és hangelemeket a sok játék, a kiismerés, és a manual segítségével keltettem életre. Úgy érzem, az összes átiratom közül talán ez sikerült a legprecízebbre.

Archon harcIzgalmas volt még a logika online játékra alkalmassá tétele. Mivel sosem csináltam még hálózati játékot, ezért a felek közötti adatcsere lebonyolítására számtalan ötletem támadt, amiket mind meg is valósítottam. A nyerő a kliens-szerver féle kialakítás lett, azaz mivel mindkét oldalon ugyanaz a játék folyik, ezért a játék logikájának elég csak az egyik helyen, a szerver oldalon futnia. A szerver feladata, hogy a klienstől érkező inputokat - vagyis a játék logikájába való beavatkozásokat - fogadja, illetve hogy a kép felépítéséhez szükséges adatokat továbbítsa a kliens felé. Röviden: a kliens a szerver oldalon futó játékot vezérli. Jelen esetben szervernek az a fél számít, aki a menüben rányom az online játék indítására, és elküldi játékostársának a kapott linket. A hivatkozást a böngészőjébe bemásoló partner pedig lesz a kliens, és a kapcsolat létrejöttéhez nem is kell ennél többet tenni.

Próbálkoztam olyannal is, hogy nem a kép felépítéséhez szükséges adatokat küldöm el, hanem magát a képet. Ez egy roppant egyszerű megoldás, a kliens gyakorlatilag streameli azt a képernyőt, amit a távolból valójában irányít. Remekül működött, és jó volt azt látni, hogy több járható út is van. Csakhogy a minimalista lelkemet bántotta a framenkénti viszonylag nagy adattömeg, úgyhogy maradtam annál a változatnál, ahol csakis a minimálisan szükséges információ kerül átadásra.

Az egymáshoz kapcsolódás megvalósítása több mint bonyolult, és magához a játékhoz sincs köze, így az inkább szenvedés. Ennek oka, hogy a WebRTC-nek nem része a felek közötti signaling, vagyis egymás hálózati adatainak kicserélése, ami a dolognak kb. az oroszlánrésze. Így azt manuálisan kell megírni, ami irtó nagy szívás tud lenni. Ha mutatkozik rá igény, akkor cikké formálom majd saját vesszőfutásomat.

A játék sebességének optimalizálásakor belefutottam egy csomó új böngésző funkcióba. Ezek közül a legkirályabb dolog az ImageBitmapFactories API. A spriteok kirajzolása nálam eddig egy sprite canvasról a képernyő canvasra történt, ám az piszok lassú tudott lenni. Mostantól viszont, a drawImage utasítás forrásként ImageBitmap-et is elfogad, és nagyságrendekkel gyorsabban tud abból dolgozni. Firefox 42-vel jött ki ez a feature, és a Chrome béta verziójában is elérhető már. Amikor ilyen új dolgokba futok bele, mindig kedvem támad a régebbi játékaimat is újraírni. Ha az Archonra pozitív visszajelzéseket kapok, akkor minden bizonnyal el fogom készíteni a Wizard of Worhoz is a hálózati támogatást, mert ott is adja magát a dolog.

A játék hálózati részének tesztelése elég körülményes volt, de ezúttal is kisegített a krissz.hu immár három fősre bővült béta-tesztelő csapata. Amikor A-val másfél órán át nyomtuk az utolsó lényig vívott harcokat, a játék közben rendesen izgultam, és teljesen megfeledkeztem arról, hogy a programomat teszteljük. Amikor K-nak a laptopján nem álltak kézre a játék által felkínált billentyűk, tudtam, hogy usability szempontból kizárólag a saját hardver infrastruktúrám világát vettem alapul, és eszerint korrigáltam. Rihardo ócska gépe rákényszerített az optimalizálásra, aminek révén számtalan új ismeretet sajátítottam el a szakmámban, illetve kedvenc elfoglaltságomnak, az algoritmusok egyszerűsítésének és begyorsításának is hódolhattam.

A teljes játékszabályát kevesen ismerik, én sem tudtam a feléről sem, ezért ajánlom a nagy harcok előtt átolvasni a manualt, vagy ezt a leírást. Jó játékot kívánok!

A játék linkje még egyszer: http://archon.krissz.hu/