Tento článek je zkráceným překladem článku Resources for HTML5 game developers, který napsali Jason Weathersby, Chris Heilmann a Victor Porof a je zde uveden pod licencí CC BY-SA 3.0.

Kde začít

Při tvorbě hry založené na HTML5 musíte provést řadu voleb, volbou editoru počínaje a rozhodováním mezi Canvas 2d, WebGL a SVG konče. Řadu užitečných informací pro začátek najdete na Mozilla Development Network v sekci Game development.

Nástroje

Nástrojů pro vývoj v HTML5 je celá řada a některé z nich jsou součástí sady vývojářských nástrojů pro Firefox, např. JavaScript Debugger, Style Editor, Page Inspector, Scratchpad, Profiler, Network Monitor a Web Console.

Canvas Debugger

V aktuálním Firefoxu (Firefox 31) najdete Canvas Debugger.

Umožní vám sledovat všechna volání API canvasu, který byla použita pro vykreslení aktuálního snímku canvasu. Je užitečný jak pro tvorbu WebGL her, tak pro hry založené na Cavas 2D. Víc informací najdete v článku Introducing the Canvas Debugger in Firefox Developer Tools.

Shader Editor

Při tvorbě WebGl her je užitečné mít možnost otestovat a upravovat shader, zatímco vaše aplikace běží. To vám umožní Shader Editor. Více se o něm dočtete v článku Live editing WebGL shaders with Firefox Developer Tools a na MDN stránce Shader Editor.

Web Audio Editor

Aktuální verze Firefoxu Aurora (32) obsahuje editor pro Web Audio, ten umí zobrazit grafickou reprezentaci audio nodů a jejich spojení v aktuálním AudioContextu.

Pokud začnete používat Web Audio, rozhodně si přečtěte článek Writing Web Audio API code that works in every browser. Více informací o editoru najdete v článku Introducing the Web Audio Editor in Firefox Developer Tools a na MDN.

Network Monitor

Sledování dopadu vaší hry na síťový provoz je nezbytností, zejména pokud budou uživatelé používat mobilní zařízení. Network Monitor vám umožní síťové požadavky vizuálně sledovat.

Navíc ho můžete použít pro porovnání chování cachované a necachované aplikace.

Více se o něm dočtete na MDN.

Web IDE

Můžete volit mezi hromadou editorů (např. Sublime, Eclipse, Dreamwaver). Pravděpodobně již máte nějaký ten váš oblíbený. Pokud chcete vyzkoušet vývoj přímo v prohlížeči, podívejte se na Web IDE, které se nedávno objevilo v nočních verzích Firefoxu. Více se o Web IDE dozvíte v článku WebIDE Lands in Nightly.