Přejít k navigační liště

Zdroják » Mobilní vývoj » Zkušenosti s psaním Firefox OS aplikací

Zkušenosti s psaním Firefox OS aplikací

Články Mobilní vývoj

Chcete si zkusit portovat nebo napsat aplikaci pro mladičký Firefox OS? Jste ryze webový vývojář, který miluje web a nestojí o to psát nativní aplikace pro Android či iOS? Zajímá vás, zda je to opravdu tak snadné, jak se říká? A jak se pak taková aplikace vlastně dostane mezi lidi? Tak na tyto a možná i některé další související otázky se vám pokusí odpovědět tento článek.

Nálepky:

Rád bych se podělil o několik praktických (a česky psaných, neboť zdrojů v angličtině a španělštině je dostatek) zkušeností o tom, jaké to je psát aplikace pro Firefox OS (FFOS), publikovat a spravovat je na Firefox Marketplace. Do dnešního dne jsem tam osobně publikoval tři aplikace a je to rozhodně zajímavá zkušenost.

Oblíbené motto FFOS „Proměnte svůj web na aplikaci pro FFOS za pět minut“ považuji za mírně řečeno optimistické, ale mnoho práce (když už tedy víte, jak na to) to opravdu není, no posuďte sami.

Minimalistická aplikace může být v podstatě jen jediný HTML soubor, ke kterému vytvoříte manifest.webapp soubor, který (s mime-typem application/x-web-app-manifest+json) slouží jako aplikační deskriptor:

{
  "version": "1.0",
  "name": "Test App",
  "description": "My first FFOS attempt",
  "icons": {
    "128": "/icon/128.png"
  }
}

Manifest může obsahovat samozřejme velkou spoustu dalších direktiv, já osobně jsem použil např. „orientation“: „landscape-primary“ nebo „fullscreen“: „true“, jenž jsou věřím samopopisné… V příkladu uvedené položky manifestu představují minimální možnou množinu všech opravdu povinných položek. Doporučuji si vaše manifesty, pro předcházení hloupým chybám, validovat, ač téhož je schopen samozřejmě i Firefox OS Simulator, což je rozšíření pro desktopový Firefox browser, emulující skutečné mobilní zařízení (já osobně jej ale používám jen okrajově, neboť jeho simulace, zejména co se velikosti fontů týče, není zdaleka dokonalá).

Obecně jsou podporovány dva druhy FFOS aplikací (certifikované systémové vyjímajíc):

1. Hostované (hosted) aplikace

Leží, běží a instalují se z vaší vlastní domény, co aplikace to doména (či port), což je omezení dané potřebou jedinečného zdroje aplikačního manifestu vaší aplikace. Chcete-li, aby aplikace fungovala i offline, je to jen na vás, abyste zajistili patřičný offline Appcache manifest, který se nijak neliší od toho, který znáte z normálních webů. Takto jsem publikoval i já svou první aplikaci a výhodou zde je jednoznačně vaše naprostá volnost měnit si aplikaci zcela dynamicky a tak často, jak to cítíte potřebné a její uživatelé dostanou při každém použití nejnovější verzi (zkrátka jako u běžných webových aplikací, jen pozor na častou chybu – do manifest.appcache souboru nesmíte zahrnout i manifest samotný, jinak celá myšlenka přestane fungovat ;-).

hosted-app-management

Pro jednoduché aplikace je toto jistě dostačující a máte-li k dispozici dostatek domén (stačí i třetí či čtvrté úrovně) anebo portů, je to dobrá volba. Komplikace nastávají, až pokud vydáte novou, opravenou či zdokonalenou verzi své aplikace a chtěli byste na to uživatele upozornit. Pak musíte na svém serveru a ve své aplikaci implementovat Push Notification API, což podle popisu fungování sice není extrémně náročné, ale dle mého názoru to představuje pro mnoho začátečníků s FFOS aplikacemi zbytečné odpoutávání pozornosti od aplikace samotné (PS: opravdu funkční Push Notifikace čekejte až ve verzi FFOS 1.1+).

Druhou a hlavní nevýhodou hostovaných aplikací je skutečnost, že chcete-li ve své aplikaci používat privilegovaná rozhraní, musí být aplikace manuálně revidovaná i instalovaná ze strany Mozilla Foundation, a tak tato API v hostovaných aplikacích nemáte možnost použít. Seznam dostupných API ve sloupci „app type required“ vám dá představu, co můžete a nemůžete pro hostované aplikace použít. Např. chcete-li pracovat se soubory na SD kartě (obrázky, audio, video) či adresářem kontaktů, máte smůlu.

Po prvotním úspěšném uploadu aplikace do marketplace je potřeba vyčkat na manuální schválení pověřenými lidmi z Mozilly, a trvá to, dle mých zkušeností, něco mezi jednou hodinou až dvěma dny (v případě, že se tak jako já trefíte do víkendu). Určitou představu o tom, jak dlouho to může trvat, vám dá online status pořadníku, kde se vaše aplikace ve frontě požadavků na vyřízení právě nachází.
Hostované aplikace můžete samozřejmě nabízet k instalaci i sami ze svých serverů, ale použití liberálního marketplace představuje velkou výhodu koncentrace uživatelů a oblíbeného místa prvního kontaktu (vznikají ale i další marketplaces, jako je např. AppsFuel, neboť tuto otevřenou politiku Mozilla podporuje od samého počatku).

2. Balené (packaged) aplikace

Vaši webovou aplikaci stačí zabalit s celou adresářovou strukturou a manifest souborem v hlavním (root) adresáři do ZIP archivu, který následně uploadnete na marketplace. Jediným rozdílem v manifestu oproti hostované aplikaci je nutnost uvést také direktivu launch_path, ukazující na zaváděcí soubor vaší aplikace. Nepotřebujete tak pro tento způsob žádný vlastní server/hosting a marketplace vám nabídne (ostatně tak jako i v případě hostované aplikace) základní správu aplikace i statistiky o počtech stažení (instalací). Nemusíte se rovněž starat ani o žádný appcache manifest pro provoz offline, neboť celá aplikace (ZIP archiv) se přímo nahraje do telefonu (či možná, dle mnohých náznaků, brzy i do i tabletu) uživatele.

packaged-app-version-management

V případě, že potřebujete verzi aktualizovat, jednoduše skrze marketplace nahrajete novou verzi (proběhne validace manifestu, že jste v direktivě version opravdu zadali vyšší hodnotu), vyplníte poznámky k vydání (changelog) a pak, stejně jako v případě prvotního schvalování, už jen čekáte na ruční ověření někým z Mozilly (to je opravdu nutné, ať už kvůli pornografii, autorským právům či samotnému ověření fungování aplikace jako takové). Poté bude automaticky všem uživatelům, kteří mají aplikaci již nainstalovanou, doručena notifikace o její dostupné nové verzi a akceptují-li výzvu k aktualizaci, stáhne se do zařízení zjednodušený (aktualizační) mini-manifest a na základě něj se vzápětí nainstaluje novější verze. Notifikace o dostupné aktualizaci aplikace bývá doručena, dle mých zkušeností, zhruba v rozmezí 1-32 hodin (podle nastavení frekvence aktualizací v zařízení, počtu restartů telefonu apod.).

Minimální náležitosti FFOS aplikace

I pro nejjednodušší aplikaci o jediném HTML souboru potřebujete minimálně jednu další bitmapovou ikonu o velikosti 128×128 pixelů (ale doporučuje se dodávat jich více v různých velikostech, např. ikona ve FFOS má 60x60px, a výsledky vyhledávání aplikací bez ikony reálně snižují šanci, že si uživatelé marketplace vaší aplikace vůbec všimnou); pro přidání do Firefox Marketplace rovněž potřebujete alespoň jeden screenshot z běhu aplikace, o minimální velikosti 320×480 pixelů.
Tím se nám tedy minimalistická aplikace pro FFOS publikovaná na Firefox Marketplace rozrostla a ustálila na čtyřech souborech a několika administrativních úkonech:

  1. aplikace samotná, typicky HTML soubor s žádnými nebo naopak mnoha externími zdroji (další HTML, JS, CSS, obrázky, zvuky apod.)
  2. bitmapová (nejlépe PNG) ikona o minimální velikosti 128x128px
  3. screenshot z běhu aplikace o minimální velikosti 320x480px
  4. aplikační manifest deskriptor (soubor manifest.webapp)
  5. uživatelský účet v marketplace (Mozilla Persona sign-in oproti mému GMail e-mailu fungoval výborně, doporučuji!)
  6. projít wizard registrace nové aplikace a počkat si na schválení

choose-platform

Při konverzi webové aplikace na FFOS aplikaci můžete samozřejmě využívat váš server k ukládání a čtení dat (existuje-li), je ale dobrým zvykem mnoha instalovaných aplikací (které nejsou přímo určeny ke konzumaci online obsahu), že by toho měly být schopny i při běhu offline (bez připojení na internet – veřte mi, že jejich uživatelé to např. v metru jistě ocení).
V mém případě byly všechny aplikace jednoduché hry, využívající server jen jako sdílené uložiště dosažených herních výsledků, což jsem v rámci maximálního zjednodušení nahradil za použití local storage a obětoval sdílení score mezi hráči.

Konkrétně se v mém případě jedná o tyto tři aplikace:

  1. Submarine Assault (SVG, Flash, JS) přetvořen do podoby FFOS aplikace, celkově to bylo docela hodně práce, zejména seznamování s gyroskopem, viz dále; jako hostovaná aplikace na hosting doméně v jediném souboru, jen audio v extra souborech
  2. Cavern Fighter (xHTML, SVG, SMIL, JS, audio), konvertován do FFOS verze, výrazně méně práce než v prvním případě, jen bylo potřeba hru dost zjednodušit, kvůli výkonnosti; jako packaged aplikace all-in-one xHTML file
  3. Game of Scotland vytvářen od počátku s myšlenkou na FFOS verzi aplikace (HTML5, AngularJS, SVG, audio) relativně jednoduchá záležitost, kde ale největší potíže mi způsobil právě Angular JS, viz dále; jako packaged aplikace s externími resources v mnoha souborech

Zajímavé postřehy z mých dosavadních implementací FFOS aplikací

Některá API jsou pro vývoj mobilních aplikací běžnému vývojáři natolik exotická, že jsem neodolal a (možná poněkud neohrabaně, ale přece) zaexperimentoval s použitím gyroskopu pro směrové ovládání namísto kurzorových kláves a vibrací pro umocnění dojmů herních výbuchů a kolizí. Abyste předešli nepříjemným gyroskopickým překvapením, doporučuji vybavit vaši aplikaci direktivou orientation a dovolit tak běh v jedné jediné poloze zařízení.
(PS: Device orientation API či classList API fungují ve Firefoxu – a tím myslím mobilním, desktopovém i FFOS – v HTML i SVG dokumentech, na rozdíl ovšem od mobilního Safari/Webkitu/MSIE, což pro mne bylo zdrojem nejednoho nemilého vystřízlivění…)

firefoxos-menu-screen

Přechod ze zařízení s vždy dostupnou hardwarovou klávesnicí a velkým, vždy stejně orientovaným (landscape) monitorem byl pro mne kulturní šok, ze kterého jsem se stále ještě plně nevzpamatoval (což nesouvisí nutně jen s FFOS, ale pro ty, kteří se vrhnou do vývoje mobilních aplikací přímo z klasického webdesignu, to bude patrně stejné). Práce s media queries se pro vás rázem dostane na úplně jinou úroveň a intenzitu než dříve a použití viewportu může situaci občas namísto zjednodušení i zkomplikovat. Všechno jsou to ale naučitelné, překonatelné věci, ovšem počítejte s tím, že se s nimi na začátku budete muset nějak vypořádat.

Ani v českých luzích a hájích oblíbený Angular JS není pro výrobu FFOS aplikací bez nějakých těch temných zákoutí, neboť jednak nejen že na low-end zařízeních nepatří k nejrychlejším, tak pro packaged aplikace, fungující interně na protokolu app:// (v rámci ZIP souboru), v dobrém záměru posilování bezpečnosti, prefixuje generované URL unsafe prefixem, a bez override jeho sanitizační metody nejsou packaged aplikace (hostovaných se toto netýká) vůbec použitelné.

Firefox Marketplace, FFOS, Firefox a Mozilla obecně jsou rovněž poměrně posedlí bezpečností CSP (Content Security Policy), takže můžete očekávat, že vám validační služby při ověřování aplikace budou generovat automatické reporty plné varování, kdykoliv se z nějakého důvodu rozhodnete použít inlinované zdroje (obrázky, audia…) či minifikované scripty. Já osobně se rozhodl, po chvíli zvažování plusů a mínusů, varování ignorovat, ale to je na každém zvlášť, jak se rozhodnete, že chcete mít svou aplikaci „čistou“.

Jakkoliv máme všichni pocit, že přehrávání audia dnes už z hlediska výpočetního výkonu hraje zanedbatelnou roli a že svobodný formát Ogg Vorbis je stejně dobrý jako komerční MP3, po problémech na low-end zařízení a konzultaci s inženýry Mozilly, upřednostňuji použití MP3 (jako primárního a OGG jako sekundárního formátu) ze dvou výkonových důvodů. Těmi jsou (prý) mírně nižší výpočetní náročnost dekodingu MP3, ale zejména slušná šance, že zařízení bude disponovat HW akcelerovaným dekodérem MP3, což může CPU znatelně ulehčit (Ogg Vorbis je naproti tomu vždy dekódován softwarově).

Osobně nedisponuji žádným Android telefonem (mimochodem, FFOS image se dá flashnout na mnoho Android telefonů, jako např. Google Nexus 4, Galaxy Nexus, Xperia E apod., což je mimochodem pro FFOS chtivého jedince v ČR zatím jedna z nejjednodušších možností, jak se telefonem s FFOS vůbec vybavit – nejasné zprávy o tom, že by se měl snad do konce roku začít prodávat telefon s FFOS i na českém trhu nejsou zatím nijak podložené) a packaged aplikace jsou v současnosti instalovatelné pouze na zařízení FFOS, mobilním Firefoxu (a FFOS Simulátoru na desktopu, ovšem ne ve všech případech). Marketplace wizard se vás bude při registraci vaší aplikace explicitně dotazovat, na API nároky a její kompatibilitu. Já se osobně vždy snažím podporu používaných API v aplikaci detekovat a přizpůsobit se, abych zajistil co největší přenositelnost a kompatibilitu (mimochodem, Firefox Marketplace detekuje podporu API zařízení, ze kterého jej používáte a automaticky odfiltrovává/skrývá aplikace, které by na něm nefungovaly, tak pozor na to!), ale poté, co mne reviewer z Mozilly 2x upozornil na to, že má aplikace na Firefox Mobile skutečně nefunguje, jsem kompatibilitu s touto platformou přestal uvádět (ač desktopová i FFOS verze fungují obě dobře) a ponechávám identifikaci problému a následné řešení do budoucna. Berte to jako radu, že raději kompatibilitu nepředpokládejte, ale ověřujte!

Nejsem vlastníkem vvojářského a žel ani rootnutého telefonu s FFOS (mám ZTE Open s FFOS verzí 1.01) a pro vývoj/ladění mobilních aplikací používám z 80% času desktopový Firefox v v responsivním režimu (verze 1.0 FFOS je postavena na bázi Gecko 18, pro ty co nevědí, a momentálně se připravuje vydání verze FFOS 1.1, přičemž plán je vydávat nové verze co tři měsíce, čili zjednodušeně řečeno, každou sudou verzi Firefox prohlížeče pro ostatní platformy). Z dalších cca 5% pak k ladění využívám simulátor (který nasměrujete na manifest soubor v lokálním adresáři a on si z něj zazipováním packaged aplikaci udělá sám automaticky), z dalších cca 5% jako běžnou webovou aplikaci z hostingu přímo na telefonu no a konečně finální ladění, zbývajících 5%, pak jako instalovanou aplikaci přímo na telefonu (jako hosted aplikaci z free hostingu), a to zejména kvůli fullscreen režimu, z FFOS browseru doposud žel nedostupného napřímo (PS: kdo by chtěl testovat na svém reálném zařízení nejen hostované, ale i packaged aplikace, lze i to, ať už skrze FFOS Simulator nebo z lokální sítě).

Low-end zařízení (pro která je FFOS cílený primárně) nejenže mají málo RAM (256MB), ale také dost malou storage pro instalované aplikace (např. ZTE Open má pro uživatelské aplikace k dispozici pouze 160MB oficiálně, ale jen143MB reálně!) a tak při výrobě svých aplikací myslete i na jejich velikost – pokud bude vaše aplikace mít dechberoucí grafiku i zvukový doprovod, ale zabírat 15MB, tak bude muset mít pro uživatele opravdu velkou hodnotu (ať už zábavní nebo informační), aby na ni byl ochoten obětoval celou desetinu své celkové kapacity. Já osobně jsem se setkal zatím s největší aplikací 7MB, ale poté co mi došlo místo, rychle putovala z telefonu pryč.
(PS: FFOS rozlišuje storage pro aplikace a storage pro data, zejména multimédia – ta je možno ukládat i na SD kartu o kapacitě až 32 GB, čili nedostatku místa pro vaši hudbu, videa, fotografie či dokumenty se bát určitě nemusíte)

Firefox OS 03

Závěr

Je toho hodně, co je dnes pro FFOS vývojáře omezujícího (slabý výkon i malá RAM low end zařízení, storage, těžko dostupná privilegovaná API či jejich nedostatek), stabilita OS jako celku, absence Web RTC (zatím!) apod. (ano, je to velmi mladý systém vyvíjený max. desítkami lidí, což je zcela nesrovnatelné s armádami vývojářů stojícími za iOS či Androidem); na druhou stranu se ale pro běžného webového vývojáře otevírají zcela nové obzory a možnosti snadné tvorby mobilních aplikací, bez potřeby učit se mnoho nového; já osobně věřím, že tato platforma (po vyřešení největších porodních bolestí – osobně odhaduji tak ve verzi FFOS 1.2+), bude dostatečně zajímavá pro tisíce a milióny vývojářů po celém světě, zejména dnes, při stále intenzivnějším sbližování webového a mobilního světa.

PS: Naportujete-li svou aplikaci pro FirefoxOS (stačí s použitím simulátoru), Mozilla vám v rámci programu Phones for Apps možná věnuje telefon úplně zadarmo – nechcete to také zkusit??

Komentáře

Subscribe
Upozornit na
guest
5 Komentářů
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
View all comments
jakubvrana

Prosím o opravu překlepu ve slově launch_patch, správně to má být launch_path.

Jan Prachař

Nenazýval temné zakoutí něco, co najdu jako první po zadání ‚unsafe‘ do vyhledávání v dokumentaci: http://docs.angularjs.org/api/ng.$compileProvider

A dotaz: xHTML je nějaký formát specifikcý pro FFOS, nebo to je obyčejné XHTML?

Milan

muhu nejak testovat aplikaci primo v telefonu? neprisel jsem na to jak ji tam nahrat. simulator he hezky ale nezvlada vsechny veci a nechci ji neotestovanou nahravat na marketplace

Enum a statická analýza kódu

Mám jednu univerzální radu pro začínající programátorty. V učení sice neexistují rychlé zkratky, ovšem tuhle radu můžete snadno začít používat a zrychlit tak tempo učení. Tou tajemnou ingrediencí je statická analýza kódu. Ukážeme si to na příkladu enum.

Pocta C64

Za prvopočátek své programátorské kariéry vděčím počítači Commodore 64. Tehdy jsem genialitu návrhu nemohl docenit. Dnes dokážu lehce nahlédnout pod pokličku. Chtěl bych se o to s vámi podělit a vzdát mu hold.