Når det kommer til programmering til mobile enheder, bliver valg hurtigt dilemma. Målretter du mod det lukrative iPhone-marked på bekostning af Androids stigende tidevand? Går du native eller skriver du kode til det mobile internet? Og mens en enkelt stak kode, der fungerer optimalt på et stadig bredere udvalg af platforme, formfaktorer og enheder, ville være drømmen, er virkeligheden et fragmenteret forsøg, hvor rudimentære opgaver ofte kan være en udfordring.
Men med udfordringer og muligheder kommer nysgerrige sind. Og afgrøden af udviklere, der henvender sig til at opbygge mobile værktøjer og biblioteker, etablerer hurtigt et levende økosystem, der hjælper mobiludviklere - især dem, der har valgt at målrette mod det mobile web.
[Også på .com: Opdag 4 måder at oprette smartphone-webapps på uden at gå gennem Apples App Store. | Hold øje med de vigtigste indsigter i applikationsudvikling med Fatal Exception-bloggen og Developer World-nyhedsbrevet. | Hold dig informeret om mobilnyheder og indsigt med Mobile Edge-bloggen og Mobilize-nyhedsbrevet. ]
I en periode var dette sæt begrænset. Men løftet om HTML5 har åbnet mange udvikleres øjne for mobilwebets utallige fordele i forhold til at forsøge at installere native software på enheden.
For det første er websteder åbne. Der er ikke behov for at spille "mor må jeg" med App Store-godkendelsesteamet, når produktet lanceres eller opdateres.
For det andet kan udviklere høste 100 procent af deres mobilappsindtægter. Selvfølgelig skal du finde en måde at indsamle pengene selv, hvilket ikke altid er simpelt. Men den nedskæring på 30 procent, som Apple tager fra app-køb, er en stejl takst for, hvad der stort set er en række i en database og et stort bureaukrati.
For det tredje bliver HTML5 mere robust og funktionsrig. Den nyeste version giver dig mulighed for at gemme data på klienten og gøre de fleste af de ting, som en native app kan gøre. Med andre ord har browsersandkassen næsten alle de samme funktioner som den oprindelige kode sandkasse. Og ja, de oprindelige kode-apps opbevares i deres eget forseglede hjørne af operativsystemet.
For det fjerde er HTML5-apps ikke enhedsbundet. Mens meget af hype fortsætter med at kredser omkring Apples iPhone, er HTML5-apps relativt lette at flytte til andre platforme. Det er ikke så simpelt som at trykke på en knap, men det er meget nemmere end at oversætte din app fra Objective C til Java.
Der er selvfølgelig begrænsninger. Webapps kan komme i forbindelse med forbindelsesproblemer. De er ofte lidt langsommere, og mange indfødte appudviklere elsker at påpege de millisekunders forsinkelser, der måske eller måske ikke er mærkbare. Spiludviklere vil gerne tænke to gange om at stole på glat, superresponsiv kode i JavaScript.
Den største begrænsning kan være i selve udviklingen. Mens Apples værktøjer er ret gode til at kigge ind i de oprindelige apps, er det sværere at grave dybt ned i strukturen på koden, der kører på din mobilbrowser. Al denne interesse for mobiludvikling og mobilwebet har skabt en række biblioteker og værktøjer til at lette processen med at opbygge applikationer med dem. Her er en liste over iøjnefaldende projekter med potentialet til at gøre det mere bekvemt at opbygge det mobile web.
Programmeringsværktøj til mobilweb: ChocolateChip-UI
Download ChocolateChip-UI
Den lille skærm fast ejendom af mobile enheder lægger en præmie på effektivt interface-design. Indtast Robert Biggs, en webudvikler i det nordlige Californien, der byggede ChocolateChip-UI, en ramme for at piske en god mobilgrænseflade op i HTML.
Teknisk set er den underliggende kode oprettet af udvikleren WAML (Web Application Markup Language), et markup-sprog bygget oven på HTML5. Det meste af det nemme arbejde udføres med WAML-tags som eller . Rammens JavaScript fungerer gennem WAML og gør det til ren HMTL5 til din smartphone.
Denne kombination er lige så let som en fjer. Du kan blande din egen HTML, CSS og JavaScript ind i WAML, og den navigerer i ChocolateChip-UI-oversættelsesprocessen fint.
Selvom denne tilgang ikke er perfekt, kan jeg forstå, hvorfor Biggs valgte denne rute. Jeg har været tabt i JavaScript-lukningerne af mange mobile udviklingsværktøjer før, og det er ikke smukt.
ChocolateChip-UIs samling af WAML-widgets er ret omfattende, som alle ser ud som standard iPhone-brugergrænseflader. Det inkluderer endda ekstraudstyr som sletningslister for at gøre det muligt for brugere at fjerne elementer fra en liste med et par fingertryk.
Programmeringsværktøj til mobilweb: Mobl
Download Mobl
JavaScript har mange uslebne kanter, der fortsat skader webudviklere. Mobl-teamet besluttede at udjævne disse kanter, mens de byggede en ramme til oprettelse af mobilapplikationer, der kører i WebKit-browsere. I stedet for at skrive dine instruktioner i HTML, JavaScript og CSS, skriver du dem i Mobl, og Mobl-kompilatoren forvandler dem til HTML, JavaScript og CSS til mobilbrowseren.
Metoden gjorde det muligt for Mobl-teamet at løse nogle af de vanskeligere problemer med JavaScript, som hvordan funktioner overføres til andre funktioner til forsinket udførelse. At holde styr på alle de indlejrede parenteser, der er nødvendige for at gøre dette i JavaScript, kan hurtigt blive bedøvende og øge sandsynligheden for fejl.
Mobl slipper af med denne kompleksitet ved at anvende en mere deklarativ syntaks. Hvis du vil sætte en pause på 1.000 millisekunder, skriver du:
søvn (1000); doNext ();
Mobl kompilerer dette til JavaScript med en setTimeout funktion og en ring tilbage funktion, der udføres doNext (). Som udvikler behøver du ikke tænke på ring tilbage syntaks eller hvordan man pakke alt sammen i endnu en funktion. Alt hvad du skal gøre er at skrive en liste over ting, du vil se ske.
Der er snesevis af måder, som Mobl-teamet hjælper dig med at skrive disse instruktioner uden at skulle være opmærksom på al tegnsætning i JavaScript. Slutresultatet er en flot samling af standard-idiomer for mobilapps. Vil du have en rulleliste? Bare pakk din liste over emner med gruppens nøgleord.
Udviklerne, der ikke kan lide denne tilgang, vil være dem, der allerede er fortrolige med Objective-C eller JavaScript. Når alt kommer til alt, hvorfor lære endnu et sprog med lidt anden syntaks, når denne lidt anderledes syntaks kun bliver vendt tilbage til noget, de allerede forstår? Derefter kan sprogelskere måske finde en række gode, nye ideer, der gør det værd at rejse.
Programmeringsværktøj til mobilweb: jQuery Mobile
Download jQuery Mobile
Da folk bag jQuery-rammen besluttede at tackle de mobile platforme og opbygge et simpelt brugergrænseflade-værktøjssæt til smartphones, var det klart, at det ville tiltrække bred opmærksomhed og eksperimenter. Resultatet er et projekt, der er godt understøttet af mange af de største hardwareproducenter og sandsynligvis vil være relativt succesfuldt på mobile enheder.
Den enkleste del af jQuery Mobile er dens HTML-centrerede layout. Sider er indbygget i DIV'er og andre standard HTML-komponenter såsom tags. Som et resultat er jQuery Mobile let at integrere med dynamiske websteder og CMSer, fordi brug af det ofte kun handler om at tilføje et nyt tema eller et nyt skin. Der er for eksempel flere Drupal-temaer og moduler bygget op omkring jQuery Mobile.
Den stramme integration med jQuery betyder, at mange, men ikke alle plug-ins til skrivebordet også fungerer med mobile websteder. Der er også et par mobile plug-ins bygget til at udvide mobilrammen. Den lette berøring af rammen og det frugtbare økosystem bygget omkring jQuery Mobile betyder, at vi sandsynligvis kun ser dens magt vokse.
Programmeringsværktøj til mobilweb: The-M-Project
Download The-M-Project
Hvis jQuery Mobils samling af metoder og stilarter ikke er sofistikeret nok, tilbyder The-M-Project en samling widgets, der er samlet ned i jQuery Mobile-objekter. Det håndterer mange af de detaljerede designdetaljer, såsom at placere et ikon på det rigtige sted, så du i stedet kan fokusere på det større billede.
Koden er struktureret med Model-View-Controller-mønsteret. Meget af arbejdet bygger en stor JSON-struktur, der definerer de forskellige sider og de widgets, der sidder inden for disse sider. Layoutet håndteres af The-M-Project.
Appens opførsel defineres ved at oprette funktioner, der er knyttet til forskellige begivenhedskrog for hver side. The-M-Project sørger for, at begivenhederne når deres placering.
Det er intet værd, at build- og implementeringsprocessen er integreret med Node.js. Koden til opbygning af din fantastiske oprettelse kører også i Node.js; testningen udføres ved hjælp af den samme server. Når det virker, kan du overføre blandingen af kode og bibliotek til enhver webserver, eller du kan integrere det yderligere med Node.js.
Programmeringsværktøj til mobilweb: Touchqode
Download Touchqode
Du sidder på en cafe i Paris, øverst på Mount Everest eller andre steder uden din bærbare eller stationære computer. En idé rammer dig. Skraber du det på et stykke papir og kommer tilbage til det senere? Ikke hvis du har Touchqode kørende på din Android-telefon. (En iPhone-version kommer snart.)
Dette lille udviklingsmiljø pakker et overraskende stort antal funktioner i en lille skærm. Koden er fremhævet, scripts kan køre lokalt, og du kan synkronisere din nye kode via FTP. Hvis chefen ringer, når du er på farten, skal du have små problemer med at ordne noget, der kun har brug for et par tastetryk. Jeg kan ikke forestille mig at skrive lange programmer med min Android-telefon, men da forfattere har komponeret hele romaner på deres mobiltelefoner, kan det være for tidligt at antage, at brugerne kun bruger Touchqode til at oprette et par linjer med lejlighedsvis kode.
Uanset hvad er Touchqode godt i en knivspids.
Programmeringsværktøj til mobilweb: LimeJS
Download LimeJS
En af grundene til, at Flash-spil er så overbevisende, er på grund af det frugtbare økosystem for biblioteksforfattere, der kan sælge deres arbejde til Flash-udviklere. DigitalFruit oprettede LimeJS for at tilbyde lignende support til udviklere, der ønsker at bruge de WebGL-objekter, der er en del af HTML5.
De tidlige resultater af LimeJS er effektive i WebKit-browsere. Koden er teknisk JavaScript, men strukturen ligner god, gammeldags C med opkald til OpenGL-biblioteket. Det skulle være muligt automatisk at krydskompilere nogle OpenGL til dette bibliotek, selvom dette sandsynligvis vil kræve en vis håndindstilling.
LimeJS-tilbud er et par nyttige funktioner til at forenkle spiludviklingen. Der er scener fyldt med lag og en instruktør, der fyrer begivenheder i henhold til en fleksibel tidsplan. Der er animationer og overgange, der flytter sprites over siderne. Alle funktionerne er velkendte for folk, der tidligere har skrevet casual spil.
Udviklingsmiljøet inkluderer flere moderne detaljer. Grundbygningen håndteres i Python, og den endelige pakke kan bundtes sammen med Googles Closure Compiler, så den downloades hurtigere.
LimeJS vil være attraktivt for alle, der har brugt tid på at udvikle spil til OpenGL-rammer i andre miljøer. Mens den endelige syntaks er JavaScript, stoler den ikke på de mere komplekse ideer, der gør JavaScript afskrækkende for nogle, i det mindste indtil Closure Compiler gør sit arbejde.
Programmeringsværktøj til mobilweb: Jdrop
Mere om Jdrop
På sit ansigt ser Jdrop ud til at være en stor bunke JSON, der kan forveksles med en åben NoSQL-database. I praksis er denne webressource indstillet til at hjælpe mobiludviklere med at samle ydeevnedata mellem de små skærme og skrivebordet, hvor de bedre kan analyseres.
For at lette vanskeligheden ved at udtrække feedback fra ydeevne fra mobile enheder tilbyder Jdrop Mobile Perf, en bookmarklet, der samler et sæt performance-bookmarklets, herunder Firebug Lite, Page Resources, DOM Monster, SpriteMe, CSSess og Zoompf. Via Mobile Perf kan du fejle din app på en telefon og automatisk gemme de resulterende data i Jdrop-skyen til senere analyse fra dit skrivebord, hvilket giver en interessant måde at debugge ægte mobil ydeevne og undersøge HTML-kilden på dine foretrukne mobilwebsteder.
Programmeringsværktøj til mobilweb: XUI, Zepto
Download XUI Download Zepto
De fleste af de rammer, der er beskrevet her, findes for at gøre det tunge løft ved at gøre en beskrivelse af applikationen, ofte skrevet på deres eget sprog, til noget, der ser ret godt ud på siden. XUI og Zepto er meget forskellige. De begynder med ideen om, at HTML og CSS allerede er ret gode til at vise de fleste af de ting, som man måske vil vise, og kun tilbyder hjælp til oprettelse og ændring af DOM.
Disse biblioteker lægger ikke dine widgets ud eller opretter endda widgets af nogen art. Du får hvad HTML tilbyder, så styrer du dets udseende med CSS. Biblioteket er der for at hjælpe dig med at manipulere DOM ved at tilbyde funktioner som muligheden for at finde elementer, vedhæfte klasser og jonglere begivenheder.
Udbetalingen er i størrelse. Den nuværende version af Zepto vejer omkring 2.300 byte, cirka en tiendedel af jQuery-størrelsen. XUI er bare lidt større. Sammenligningen med jQuery er passende, fordi begge låner meget af syntaksen uden at tilbyde nogen af de funktioner, der kræver mere sofistikeret og tung kode. XUI trækker for eksempel den kode ud, der kræves for at være kompatibel med BlackBerry eller IE Mobile. Hvis du vil have dem, kan du få et federe bibliotek.
