Programování

13 základních programovacích nástrojů pro mobilní web

Pokud jde o programování pro mobilní zařízení, volba se rychle stává dilematem. Zaměřujete se na lukrativní trh iPhone na úkor rostoucího přílivu Androidu? Jdete nativně nebo píšete kód na mobilní web? A zatímco snem by byl jediný zásobník kódu, který funguje optimálně na stále širší škále platforem, tvarových faktorů a zařízení, realitou je roztříštěný pokus, ve kterém mohou být základní úkoly často výzvou.

Ale s výzvami a příležitostmi přicházejí zvědavé mysli. A plodina vývojářů, kteří věnují pozornost budování mobilních nástrojů a knihoven, rychle vytváří živý ekosystém, který pomáhá mobilním vývojářům - zejména těm, kteří se rozhodli cílit na mobilní web.

[Také na .com: Objevte 4 způsoby, jak vytvářet webové aplikace pro smartphony, aniž byste museli procházet Apple App Store. | Držte krok s klíčovými poznatky o vývoji aplikací pomocí blogu Fatal Exception a bulletinu Developer World. | Zůstaňte v obraze o novinkách a statistikách z mobilu pomocí blogu Mobile Edge a zpravodaje Mobilize. ]

Na nějaký čas byla tato sada omezená. Ale příslib HTML5 otevřel oči mnoha vývojářů na nesčetných výhodách mobilního webu ve srovnání s pokusem o instalaci nativního softwaru do zařízení.

Nejprve jsou otevřené webové stránky. Při spuštění nebo aktualizaci produktu není třeba hrát „matka může“ s týmem schválení App Store.

Za druhé, vývojáři mohou sklízet 100 procent svých výnosů z mobilních aplikací. Samozřejmě musíte najít způsob, jak si vybrat peníze sami, což není vždy jednoduché. Ale 30 procentní snížení, které Apple bere z nákupů aplikací, je strmý tarif pro to, co je do značné míry řádek v databázi a velká byrokracie.

Zatřetí, HTML5 je stále robustnější a bohatší na funkce. Nejnovější verze umožňuje ukládat data na klientovi a provádět většinu věcí, které dokáže nativní aplikace. Jinými slovy, karanténa prohlížeče má téměř všechny stejné funkce jako karanténa nativního kódu. A ano, aplikace nativního kódu jsou uchovávány ve svém vlastním zapečetěném rohu operačního systému.

Za čtvrté, aplikace HTML5 nejsou vázány na zařízení. Zatímco velká část humbuku nadále obíhá kolem Apple iPhone, aplikace HTML5 lze relativně snadno přesunout na jiné platformy. Není to tak jednoduché jako stisknutí tlačítka, ale je to mnohem jednodušší než překlad aplikace z Objective C do Javy.

Existují samozřejmě omezení. Webové aplikace se mohou stát kořistí problémů s připojením. Často jsou o něco pomalejší a mnozí vývojáři nativních aplikací rádi poukazují na milisekundová zpoždění, která mohou nebo nemusí být patrná. Herní vývojáři si budou chtít dvakrát rozmyslet, jestli se spoléhají na úhledný a velmi citlivý kód v JavaScriptu.

Největší omezení může být ve vývoji samotném. Zatímco nástroje společnosti Apple jsou docela dobré pro peering do nativních aplikací, je těžší hlouběji se ponořit do struktury kódu běžícího ve vašem mobilním prohlížeči. Veškerý tento zájem o mobilní vývoj a mobilní web vytvořil řadu knihoven a nástrojů pro usnadnění procesu vytváření aplikací s nimi. Zde je seznam poutavých projektů s potenciálem usnadnit vytváření mobilního webu.

Programovací nástroj pro mobilní web: ChocolateChip-UI

Stáhnout ChocolateChip-UI

Nemovitost mobilních zařízení na malé obrazovce klade důraz na efektivní design rozhraní. Zadejte Roberta Biggsa, webového vývojáře v severní Kalifornii, který vytvořil ChocolateChip-UI, rámec pro vybičování užitečného mobilního rozhraní v HTML.

Technicky je podkladovým kódem vytvořeným vývojářem WAML (Web Application Markup Language), značkovací jazyk postavený na HTML5. Většina snadné práce se provádí pomocí značek WAML nebo . JavaScript rámce funguje prostřednictvím WAML a promění jej v čistý smartphone HMTL5 pro smartphone.

Tato kombinace je lehká jako pírko. Do WAML můžete vložit vlastní HTML, CSS a JavaScript a navigace v procesu překladu ChocolateChip-UI je v pohodě.

I když tento přístup není dokonalý, chápu, proč si Biggs vybral tuto cestu. Dříve jsem se ztratil v uzavření JavaScriptu mnoha nástrojů pro vývoj mobilních zařízení a není to hezké.

Sbírka widgetů WAML v ChocolateChip-UI je poměrně komplexní a všechny vypadají jako standardní uživatelská rozhraní pro iPhone. Zahrnuje dokonce doplňky, jako jsou seznamy mazání, které umožňují uživatelům eliminovat prvky ze seznamu několika pohyby prstem.

Programovací nástroj pro mobilní web: Mobl

Stáhnout Mobl

JavaScript má mnoho drsných okrajů, které nadále ohrožují webové vývojáře. Tým Mobl se rozhodl tyto okraje vyhladit a zároveň vytvořit rámec pro vytváření mobilních aplikací, které běží v prohlížečích WebKit. Místo psaní pokynů v HTML, JavaScriptu a CSS je píšete v Moblu a kompilátor Mobl je promění v HTML, JavaScript a CSS pro mobilní prohlížeč.

Tento přístup umožnil týmu Mobl opravit některé složitější problémy JavaScriptu, například způsob předávání funkcí jiným funkcím pro zpožděné spuštění. Sledování všech vnořených závorek nezbytných k tomu v JavaScriptu se může rychle stát otupujícím, což zvyšuje pravděpodobnost chyby.

Mobl se zbaví této složitosti použitím deklarativní syntaxe. Chcete-li pozastavit 1 000 milisekund, napíšete:

spánek (1 000); doNext ();

Mobl to zkompiluje do JavaScriptu s setTimeout funkce a zpětné volání funkce, která se provede doNext (). Jako vývojář nemusíte myslet na zpětné volání syntaxe nebo jak vše zabalit do jiné funkce. Jediné, co musíte udělat, je napsat seznam věcí, které chcete vidět.

Existuje několik způsobů, jak vám tým Mobl pomáhá psát tyto pokyny, aniž byste museli věnovat pozornost všem interpunkcím v JavaScriptu. Konečným výsledkem je pěkná sbírka standardních idiomů mobilních aplikací. Chcete rolovací seznam? Stačí zabalit seznam položek klíčovým slovem skupiny.

Vývojáři, kterým se tento přístup nebude líbit, budou ti, kteří již mají s Objective-C nebo JavaScript pohodlí. Koneckonců, proč se učit další jazyk s mírně odlišnou syntaxí, když se tato mírně odlišná syntaxe změní jen na něco, čemu už rozumí? Milovníci jazyka pak mohou najít řadu dobrých, nových nápadů, díky nimž to za ten výlet stojí.

Programovací nástroj pro mobilní web: jQuery Mobile

Stáhněte si jQuery Mobile

Když se lidé za rámcem jQuery rozhodli vypořádat se s mobilními platformami a vytvořit jednoduchou sadu nástrojů uživatelského rozhraní pro smartphony, bylo jasné, že by to přitahovalo širokou pozornost a experimentování. Výsledkem je projekt, který je dobře podporován mnoha významnými výrobci hardwaru a který musí být relativně úspěšný na mobilních zařízeních.

Nejjednodušší částí aplikace jQuery Mobile je její rozložení zaměřené na HTML. Stránky jsou zabudovány v DIV a dalších standardních komponentách HTML, jako je

  • značky. Díky tomu je jQuery Mobile snadno integrovatelný s dynamickými webovými stránkami a CMS, protože jeho použití je často jen otázkou přidání nového tématu nebo vzhledu. Existuje například několik témat a modulů Drupalu postavených kolem jQuery Mobile.

    Těsná integrace s jQuery znamená, že mnoho, ale ne všechny doplňky pro stolní počítače, bude fungovat také s mobilními weby. Existuje také několik mobilních modulů plug-in, které rozšiřují mobilní rámec. Lehký dotek rámce a úrodného ekosystému postaveného na jQuery Mobile znamená, že pravděpodobně uvidíme, jak jeho síla pouze poroste.

    Programovací nástroj pro mobilní web: The-M-Project

    Stáhněte si The-M-Project

    Pokud kolekce metod a stylů jQuery Mobile není dostatečně propracovaná, The-M-Project nabízí kolekci widgetů, které jsou kompilovány do objektů jQuery Mobile. Zvládne mnoho drobných designových detailů, jako je umístění ikony na správné místo, takže se místo toho můžete soustředit na větší obrázek.

    Kód je strukturován vzorem Model-View-Controller. Velká část práce spočívá v budování velké struktury JSON, která definuje různé stránky a widgety, které se na těchto stránkách nacházejí. Rozložení zpracovává The-M-Project.

    Chování aplikace je definováno vytvořením funkcí připojených k různým háčkům událostí pro každou stránku. The-M-Project se stará o to, aby se události dostaly na jejich místo.

    Nestojí za nic, že ​​proces sestavení a nasazení je integrován do Node.js. Kód pro vytváření skvělé tvorby také běží v Node.js; testování se provádí pomocí stejného serveru. Když to funguje, můžete směs kódu a knihovny přenést na jakýkoli webový server, nebo ji můžete dále integrovat s Node.js.

    Programovací nástroj pro mobilní web: Touchqode

    Stáhněte si Touchqode

    Sedíte v kavárně v Paříži, na vrcholu Mount Everestu nebo kdekoli jinde bez notebooku nebo stolního počítače. Napadne vás nápad. Čmáráte to na kousek papíru a vrátíte se k tomu později? Ne, pokud máte na telefonu Android spuštěný Touchqode. (Verze pro iPhone bude brzy k dispozici.)

    Toto malé vývojové prostředí obsahuje na malé obrazovce překvapivě velké množství funkcí. Kód je zvýrazněn, skripty lze spouštět lokálně a nový kód můžete synchronizovat pomocí FTP. Pokud šéf volá, když jste na cestách, měli byste mít malé potíže s opravou něčeho, co potřebuje jen několik stisknutí kláves. Nedokážu si představit, že bych s telefonem s Androidem psal dlouhé programy, ale vzhledem k tomu, že autoři na svých mobilních telefonech složili celé romány, může být příliš brzy předpokládat, že uživatelé k vytvoření několika řádků příležitostného kódu použijí pouze Touchqode.

    Ať tak či onak, Touchqode je dobrý na první pohled.

    Programovací nástroj pro mobilní web: LimeJS

    Stáhnout LimeJS

    Jedním z důvodů, proč jsou hry Flash tak přesvědčivé, je úrodný ekosystém autorů knihoven, kteří mohou svou práci prodávat vývojářům Flash. DigitalFruit vytvořil LimeJS, aby nabídl podobnou podporu vývojářům, kteří chtějí používat objekty WebGL, které jsou součástí HTML5.

    První výsledky LimeJS jsou účinné v prohlížečích WebKit. Kód je technicky JavaScript, ale struktura vypadá podobně jako dobrý staromódní C s voláním do knihovny OpenGL. Mělo by být možné automaticky překompilovat některé OpenGL do této knihovny, i když to bude pravděpodobně vyžadovat určité ruční ladění.

    Nabídky LimeJS jsou několik užitečných funkcí pro zjednodušení vývoje her. Existují scény plné vrstev a režisér, který bude střílet události podle flexibilního plánu. Existují animace a přechody, které pohybují skřítky po stránkách. Všechny funkce budou známé lidem, kteří již dříve psali příležitostné hry.

    Vývojové prostředí zahrnuje několik moderních prvků. Základní budova je zpracována v Pythonu a finální balíček lze spojit společně s Google Closure Compiler, aby se stahoval rychleji.

    LimeJS bude atraktivní pro každého, kdo strávil čas vývojem her pro rámce OpenGL v jiných prostředích. Zatímco konečná syntaxe je JavaScript, nespoléhá se na složitější nápady, díky nimž se JavaScript pro některé z nich odkládá, přinejmenším do doby, než překladač Closure provede svou práci.

    Programovací nástroj pro mobilní web: Jdrop

    Více o Jdrop

    Na první pohled se zdá, že Jdrop je velká hromada JSON, kterou lze zaměnit za otevřenou databázi NoSQL. V praxi je tento webový zdroj vyladěn tak, aby pomohl vývojářům mobilních aplikací srovnávat údaje o výkonu mezi malými obrazovkami a desktopem, kde je lze lépe analyzovat.

    Pro usnadnění obtíží při získávání zpětné vazby o výkonu z mobilních zařízení nabízí Jdrop Mobile Perf, záložku, která agreguje sadu záložek s výkonem, včetně Firebug Lite, Page Resources, DOM Monster, SpriteMe, CSSess a Zoompf. Prostřednictvím Mobile Perf můžete ladit svou aplikaci v telefonu a automaticky ukládat výsledná data do cloudu Jdrop pro pozdější analýzu z vašeho počítače, což poskytuje zajímavý způsob ladění skutečného mobilního výkonu a zkoumání zdroje HTML vašich oblíbených mobilních webů.

    Programovací nástroj pro mobilní web: XUI, Zepto

    Stáhnout XUI

    Stáhněte si Zepto

    Většina zde popsaných rámců existuje proto, aby provedla těžké zvedání tím, že převede popis aplikace, často psaný v jejich vlastním jazyce, na něco, co na stránce vypadá docela dobře. XUI a Zepto se velmi liší. Začínají myšlenkou, že HTML a CSS jsou již docela dobré při zobrazování většiny věcí, které by člověk mohl chtít zobrazit, a nabízejí pouze pomoc s vytvořením a úpravou DOM.

    Tyto knihovny nebudou rozkládat vaše widgety ani vytvářet widgety jakéhokoli druhu. Získáte to, co nabízí HTML, a pak budete řídit jeho vzhled pomocí CSS. Knihovna je zde, aby vám pomohla manipulovat s DOM tím, že nabízí funkce, jako je schopnost najít prvky, připojit třídy a žonglovat s událostmi.

    Výplata je ve velikosti. Aktuální verze Zepta váží přibližně 2300 bajtů, což je zhruba jedna desetina velikosti jQuery. XUI je jen o něco větší. Srovnání s jQuery je výstižné, protože oba si vypůjčují velkou část syntaxe, aniž by nabídli některou z funkcí, které vyžadují propracovanější a těžší kód. Například XUI vytáhne kód, který je vyžadován pro kompatibilitu s BlackBerry nebo IE Mobile. Pokud je chcete, můžete získat tlustší knihovnu.

    $config[zx-auto] not found$config[zx-overlay] not found