Claudiu Persoiu

Blog-ul lui Claudiu Persoiu


Archive for the ‘Titanium’ tag

Appcelerator Titanium – cateva impresii

without comments

Nota: Titanium si PhoneGap sunt doua platforme pentru dezvoltarea de aplicatii hibride pentru mobil. Aceste aplicatii nu sunt scrise in limbajul de programare nativ telefonului, dar pot fi distribuite pe mai multe platforme mobile.

Recent, am publicat pe Github cea mai noua si extraordinara platforma de teste, Just-Quizzing pe numele ei. Am facut-o ca sa o folosesc eu personal, dar pentru ca am gasit cativa colegi care au considerat-o utila, am facut-o publica.

In versiunea initiala foloseam SL4A pentru a publica aplicatia pe telefonul meu mobil cu Android. Aveam nevoie de un mod in care sa folosesc aplicatia cand sunt in miscare si nu am acces la Intenet. Din pacate nu exista actualizare automata pentru teste. Am sperat ca SL4A va avea o directie mai clara in timp, dar platforma si-a pierdut din elanul initial, iar eu am decis sa scriu o aplicatie mobila.

Am avut de ales intre PhoneGap si Titanium. In trecut am folosit PhoneGap pentru ca marimea aplicatiei era prea mare in Titanium, dar am zis sa ii mai dau o sansa. In 2011, cand am mai scris despre Titanium, marimea unei aplicatii de baza era aproximativ 4M. In ziua de azi nu mi se mai pare chiar atat de mare, desi este maricica.

Perspectiva va fi in special pentru Android, desi aplicatia a fost facuta sa fie compatibila si cu iPhone.

Am folosit SDK 3.1.3, fara framework-ul Alloy.

Alloy are si el curba lui de invatare si am vrut sa o evit. Scopul aplicatiei era sa fie o versiune portabila a testelor de pe server si nu am vrut sa fac o investitie foarte mare de timp.

Timpul total de dezvoltare a fost putin mai mult de o saptamana.

Prima parere

Lucrurile nu merg chiar asa cum te astepti, nu ai foarte multa flexibilitate. Din timpul total alocat, mai mult de un sfert am incercat sa fac un “flyout menu”, asa cum au aplicatiile ca: Facebook, Google Plus si Youtube. A fost un dezastru total! Singurele variante care chiar pareau sa mearga au fost folosirea unui modul extern sau folosirea widgetul-ui din Alloy.

Se pare ca la conversia dintre coordonatele relative, unde utilizatorul a atins elementul curent, la punctul efectiv, unde esti pe ecran, exista o discrepanta mare si este imposibil sa faci un efect decent de deschidere a meniului. Intr-un final am renuntat total la acest efect.

Viteza nu este chiar atat de buna cand vine vorba de randare de elemente. Sincer, ma asteptam la o viteza mai buna. Exista mici trucuri care se pot face, de exemplu sa preincarci view-urile inainte sa le afisezi, dar pentru asta trebuie sa interpretezi cam ce va face utilizatorul in continuare, lucru care nu este posibil mereu.

Un alt elemente care m-a deranjat este ca la apasarea butonului de meniu pe Android nu poti pune o actiune anume, sa zicem sa deschida meniul lateral de care vorbeam anterior. In PhoneGap de exemplu, nu se va deschide nici un meniu, acesta trebuie construit din HTML de la zero.

Cand au aparut, Titanium se laudau ca poti dezolta o data si distribui pe mai multe platforme. Acum am avut surpriza ca nu mai au aceasta abordare. In Kitchen Sink, aplicatia care demonstreaza facilitatile platformei, fiecare tip de platforma initializeaza aplicatia in fisierul ei. Unul dintre motive este ca design-ul se face dinamic daca nu vrei sa folosesti Alloy, nu prin fisiere de layout.

Printre primele lucruri pe care le-am incercat cu Titanium a fost sa vad cat este marimea unei aplicatii simple de “Hello World”. Impachetata, aplicatia ocupa ~8.5M, instalata pe telefon ~16M. Nu stiu ce parere aveti voi, dar mie mi se pare foarte mult! Ciudat este ca aplicatia mea finala ocupa ~8.4M impachetata si ~16M instalata, aproape identic cu aplicatia originala. Motivul este simplu, imaginile puse de mine ocupa cu cativa kb mai putin, rezultand in final o aplicatie putin mai mica decat aceea de la care am pornit.

Dar de ce ocupa o aplicatie Titanium atat de mult?

Am avut de cautat pana am gasit raspunsul. In 2011, cand am incercat sa ma documentez, nu am gasit decat ca sunt impachetate toate librariile chiar daca sunt necesare sau nu si din acest motiv este atat de mare. Nu asta era cauza! Intre timp, am aflat adevaratul motiv. Aplicatia ruleaza folosind un “bridge” intre Android si JavaScript. Codul JavaScript nu este “compilat”, asa cum reiese din prezentarile initiale, ci pur si simplu interpretat.

Codul JavaScript este interpretat folosind unul din motoarele disponibile in aplicatie (V8 si Rhino) si apeleaza componentele care construiesc elementele grafice native.

Problema este la interpretoare (engine). Acestea sunt destul de mari si sunt practic prezente in fiecare aplicatie. Si, de parca nu erau destul de mari, sunt si 3, fiecare cu scopul lui:

  • V8 – pentru versiuni de Android noi (dupa Gingerbread 2.3);
  • Rhino – pentru versiuni vechi de Android (inainte de Gingerbread 2.3);
  • x86 – pentru procesoare de tip Intel.

Aceste 3 engine-uri ocupa in total, dezarhivate, 19M pe calculatorul meu. Deci, fara sa eliminam o parte din ele nu avem cum sa scadem dimensiunea.

O metoda prin care cei de la Appcelerator vor sa scada dimensiunea apk-ului este sa renunte la Rhino, dar in acest mod se va pierde si compatibilitatea cu versiuni mai vechi de Android.

Comunitate

Exista o comunitate foarte activa. Pe forumuri si platforme Q/A este plin de intrebari si raspunsuri! Trebuie sa recunosc ca am fost impresionat din acest punct de vedere. Unele intrebari sunt relativ vechi, chiar si de 3 ani de zile.

Curba de invatare

Pentru o saptamana si aproape jumatate, din care mai bine de un sfert am cautat cum sa fac un efect de miscare al unui view, care pana la final nu a functionat, eu zic ca a mers destul de repede!

Recunosc, m-am mai jucat acum 3-4 ani cu el pentru cateva zile si chiar mi-am amintit anumite lucruri, cum ar fi ca erau elemente de tip window, view si label.

Faptul ca gasesti usor raspunsuri la intebarile de pe Stackoverflow, adunate in cativa ani, dar si ca exista o documentatie destul de bine organizata a ajutat foarte mult.

De asemenea si pe Youtube exista cateva tutoriale utile.

Mediul de dezoltare

Pentru primele versiuni nu exista un IDE, aplicatiile erau scrise cu un editor la alegere, apoi impachetate si testate folosind platforma.

Acum exista un IDE care are la baza Eclipse. Numele acestuia este Titanium Studio. Acesta are un autocomplete destul de reusit, care ajuta in cele mai multe cazuri. Are si cateva lucruri care nu merg prea bine, cum ar fi faptul ca mie uneori nu mi-a mai mers syntax highlight, fara sa-mi indice unde este problema. De asemenea, administrarea proiectelor mi se pare un pic ciudata si am avut cateva probleme la importul si exportul de proiecte.

Nu exista implicit o unealta vizuala de editare a elementelor din fereastra. Atat Xcode cat si ADT permit editarea de elemente cu drag & drop. Se pare ca exista si unelte de acest tip, dar nu sunt gratuite.

Emulatoarele nu sunt foarte configurabile. Partea buna este ca nu trebuie sa-ti bati capul, selectezi sistemul de operare si tipul de display si Titanium va configura automat un emulator. Partea proasta este ca poate mi-ar placea sa am un management al resurselor mai clar.

Un alt dezavantaj este ca uneori aplicatia pur si simplu moare pana porneste emulatorul, iar daca incerci din nou va incerca sa mai porneasca un emulator fara succes, caz in care trebuie inchis emulatorul, rulat Project clean si apoi incercat din nou, cu grija sa nu ratam momentul cand se poate debloca ecranul, sau scenariul de la inceput se va repeta.

Pentru iPhone nu merg log-urile cand vine vorba de OS X Mavericks.

Parti bune

Se invata relativ usor.

Documentatia este destul de bine realizata, iar acolo unde ceva nu este clar, sigur a mai intebat altcineva aceeasi intrebare.

Exista o comunitate destul de mare.

IDE-ul este usor de folosit.

Este usor de vazut cam ce este posibil in aplicatia Kitchen Sink.

Aplicatia nu arata ca o pagina web intr-un WebView!

Parti rele

Aplicatia ocupa foarte mult spatiu (16M pe telefon).

Elementele grafice sunt doar niste subseturi din platformele suportate.

Nu este foarte rapid, din cauza faptului ca avem codul intepretat si nu compilat, ca sa poata interactiona direct cu OS-ul.

Nu exista un editor vizual.

Exista probleme de integrare cu emulatoarele, atat pentru Android cat si pentru iPhone.

Concluzie

Daca esti un cunoscator al limbajului JavaScript, ai nevoie repede de o aplicatie si vrei sa foloseasca elemente grafice native, atunci probabil Titanium este pentru tine.

Daca vrei performanta, probabil trebuie sa te orientezi spre altceva.

Eu nu am suficienta experienta cu SDK-ul Android cat sa pot construi aceasta aplicatie in timpul care l-am avut, acesta a fost compromisul meu.

Sincer, nu sunt sigur daca PhoneGap era o optiune mai buna sau nu, vorbind de cazul meu paticular. Astazi exista multe librarii de JavaScript facute special sa emuleze elementele grafice native intr-o aplicatie PhoneGap. Diferenta nu este neaparat vizibila si, pana la urma, uneori poate aplicatia chiar nu trebuie sa arate ca o aplicatie standard, poate o interfata complet diferita este mai potrivita.

Written by Claudiu Persoiu

24 December 2013 at 1:13 PM

Posted in JavaScript

Tagged with , ,

PhoneGap – primele impresii

without comments

In ultima saptamana am vrut sa fac o mica aplicatie pentru mobil (Android). Initial am vrut sa o fac folosind Titanium, platforma cu care m-am mai jucat si am fost placut impresionat.

Totusi dupa ce am descarcat compilatorul si am facut prima aplicatie am avut o surpriza, aplicatia “Hello world” avea aproximativ 5M. Cum s-a ajuns la marimea asta? Simplu, Titanium compileaza aplicatile in cod nativ dar nu exista o metoda clara prin care sa determine ce API-uri sunt folosite, asa ca va introduce minimul necesar pentru toate functionalitatile. Perspectiva de o aplicatie care trece de 5M nu m-a incantat asa ca am inceput sa caut alternative.

Mi-am instalat Phonegap, am vrut sa fac un joc si cu aceasta plaforma de mult timp, dar avand in vedere ca nu are o instalare la fel de eleganta ca Titanium nu m-a incantat. Am facut o aplicatie “Hello world” si surpriza… ~200k! O dimensiune rezonabila pentru mine.

Evident exista o explicatie, Phonegap ofera acces la multe facilitati cum ar fi: accelerometru, camera sau contacte, dar nimic pe partea de prezentare. Partea de prezentare este facuta exclusiv prin HTML, CSS si JavaScript.

Intreagul proiect Phonegap se bazeaza pe faptul ca platformele importante au nativ un “web view” care poate parsa o pagina web.

In plus, pentru ca proiectul nu este la fel de “elegat” ca Titanium poti adauga facilitati destul de usor. De exemplu pentru Android exista un numar decent de proiecte care adauga facilitati in plus pentru platforma. Modul de incarcare al lor nu e foarte dificil dar nici plug & play. Practic sunt module de Java pentru Android care au si un API care poate fi apelat din “web view”. Acesta poate sa fie un avantaj, pentru ca exista multa lume care scrie module suplimentare care nu trebuie sa fie neaparat in “core”.

Pentru aplicatii simple care fac listari sau afisaza informatii, platforma este o alternativa interesanta, mai ales ca exista o serie intreaga de framework-uri JavaScript si CSS pentru formatare, cum ar fi: jQTouch, jQuery Mobile sau XUI. Platforma este foarte buna pentru a impacheta aplicatii de acest fel. De exemplu daca ai o aplicatie HTML pentru mobil si vrei sa-i adaugi functionalitate nativa in plus si sa o distribui compilata, Phonegap face o treaba buna.

Pe de alta parte chiar daca poti accesa de exemplu butonul de meniu, nu poti construi un meniu nativ.

Concluzionand, este o platforma cu o abordare complet diferita fata de Titanium. Daca Titanium se bazeaza pe faptul ca aplicatia va ajunge cod nativ cu API-uri native, cu tot codul scris in JavaScript, iar web view este una din optiuni, abordarea PhoneGap este ca toata prezentarea sa fie exclusiv in web view folosind HTML(5) + CSS si doar cateva API-uri specifice dispozitivelor care nu pot fi accesate din browser si nu sunt legate de prezentare sa fie expuse, cum ar fi vibratia, butoanele, etc. Avand in vedere aceste lucruri nu cred ca se poate face o comparatie reala intre platforme, doar programatorul poate decide care este abordarea de care are nevoie.

Written by Claudiu Persoiu

14 August 2011 at 3:05 PM

Posted in Diverse,JavaScript

Tagged with , ,