To już trzecia część cyklu StormSnapshot. W poprzednim wpisie kurs aplikacji mobilnych zebraliśmy podstawowe różnice między aplikacjami hybrydowymi a natywnymi oraz przedstawiliśmy argumenty przemawiające za każdym z tych rozwiązań.
Dzisiaj zajmiemy się porównaniem najbardziej znanych frameworków mobilnych aplikacji hybrydowych.
Spis treści
Co jest dla mnie najważniejsze?
To zasadnicze pytanie z punktu widzenia tego porównania. Frameworków dla aplikacji mobilnych jest tak dużo, że musimy najpierw zastanowić się, na co zwrócić uwagę i jakie ich cechy są dla nas najważniejsze.
Stos technologiczny
Stos technologiczny, czyli to, z jakich technologi będziemy korzystać, jest niezwykle ważny. Już wcześniej powiedzieliśmy sobie, że nie chcemy pisać aplikacji natywnych, żeby nie skupiać się na technologiach typowo specyficznych dla danej platformy.
Z mojego punktu widzenia idealny stos technologiczny to połączenie Javy oraz technologii webowych: JavaScript, HTML i CSS.
Wydajność aplikacji
Powstała aplikacja będzie uruchamiana na urządzeniach mobilnych, czyli w środowisku o dość ograniczonych zasobach.
Wykorzystane technologie powinny zapewniać możliwie największą płynność działania aplikacji. Użytkownicy są bardzo niecierpliwi. To, że aplikacja przycina się lub zwyczajnie działa za wolno, w tym wypadku jest nie do zaakceptowania. Znaczenie ma również rozmiar powstałej aplikacji i ilość wykorzystywanej pamięci RAM, jednak nie jest to kluczowe.
Szybkość i prostota developmentu
Aplikację powinno pisać się prosto, szybko i przyjemnie 🙂 Na ten punkt składa się wiele czynników, jednak przede wszystkim: wykorzystane technologie, ilość i jakość dostępnych komponentów oraz możliwość szybkiego testowania wprowadzanych zmian w kodzie.
Prostota debugowania i testowania aplikacji
Nie ma chyba nic bardziej denerwującego dla programistów niż długie przebudowywanie aplikacji, żeby sprawdzić, czy dany przycisk będzie lepiej wyglądał dwa piksele w lewo, a może jeden w prawo…
Zmiany wprowadzane w aplikacji powinny być widoczne dla programisty możliwie jak najszybciej.
Możliwość dopisania własnych, niestandardowych komponentów
Żaden, nawet najlepszy, framework nie jest w stanie dostarczyć wszystkich funkcjonalności. Wykorzystane rozwiązanie powinno udostępniać możliwość napisania fragmentu kodu z wykorzystaniem natywnych technologii.
Społeczność
Jedną z głównych zalet rozwiązań OpenSource jest społeczność, która stoi za danym projektem. To właśnie do niej będziemy się zwracać, kiedy pojawią się pierwsze problemy podczas developmentu. Od tego, czy społeczność jest aktywna, zależy również ilość dostępnych gotowych komponentów do wykorzystania.
Jeżeli społeczność jest zbyt mała albo nieaktywna, sami będziemy musieli rozwiązywać wiele problemów, a może również się zdarzyć, że projekt zwyczajnie umrze śmiercią naturalną.
Apache Cordova (dawniej PhoneGap)
PhoneGap to jeden z najstarszych i najbardziej znany framework aplikacji hybrydowych, dlatego po prostu musi pojawić się w każdym zestawieniu.
Przy pomocy tego narzędzia budowana jest natywna aplikacja opakowująca na konkretny system operacyjny. Wewnątrz wrappera logika biznesowa aplikacji zrealizowana jest przez HTML, CSS i JavaScript, a możliwości samego JavaScriptu rozszerzone są o dostęp do natywnych funkcjonalności urządzenia.
Nad rozwojem projektu na wolnej licencji Apache 2.0 czuwa przede wszystkim Adobe Systems.
Projekt ma bardzo aktywną i liczną społeczność oraz ogromną bazę istniejących pluginów, gdyby jednak i ona okazała się niewystarczająca, zawsze można dopisać własne rozszerzenie.
Ponieważ powstała aplikacja jest również stroną www, podstawowe jej mechanizmy oraz wygląd można testować w zwykłej przeglądarce.
Ionic
Ionic to kompletne SDK przeznaczone do wytwarzania aplikacji mobilnych. Zbudowany jest z wykorzystaniem Apache Cordova oraz AngularJS.
Projekt rozwijany na licencji MIT. Ponieważ swoje działanie opiera na PhoneGap, odziedziczył również po nim ogromną bazę dostępnych pluginów i społeczność.
Pisanie aplikacji w Ionic przypomina trochę składanie strony www z gotowych klocków udostępnionych za darmo lub odpłatnie na Ionic Market.
Sencha Touch
Sencha Touch to framework napisany i wspierany przez twórców Ext JS, do swojego działania wykorzystuje HTML 5. Wspierane systemy operacyjne to między innymi: iOS, Android, BlackBerry oraz Windows Phone. Framework dostępny jest na podwójnej licencji Commercial License oraz GPLv3.
Kendo UI
Kendo UI to kolejny framework napisany z wykorzystaniem HTML 5 oraz biblioteki jQuery. Niestety znaczna część nawet podstawowych komponentów jest dostępna tylko odpłatnie.
React Native
React Native to nie jest typowy framework hybrydowy. Aplikację piszemy co prawda z wykorzystaniem JavaScript, ale na jego podstawie generowane są natywne komponenty. W efekcie czego aplikacje powstałe przy pomocy tego frameworka są tylko nieznacznie wolniejsze od natywnych.
Mimo braku możliwości testowania aplikacji w przeglądarce sam development i podglądanie zmian są również bardzo szybkie dzięki możliwości przeładowania komponentów, bez konieczności budowania całego projektu.
Kod powstały z wykorzystaniem biblioteki React zawiera pomieszane fragmenty logiki biznesowej oraz widoku, co może być dla niektórych odstraszające.
Projekt ma wsparcie bardzo silnej i aktywnej społeczności, jest również wspierany przez developerów Facebooka. Przekłada się to na dużą bazę dostępnych komponentów. Ciekawostką jest to, że przy jego pomocy można również wykorzystać istniejące pluginy z PhoneGap.
Intel XDK
Intel XDK to rozwijane przez Intel środowisko do tworzenia wieloplatformowych aplikacji mobilnych z wykorzystaniem HTML5, CSS, JavaScript oraz Apache Cordova.
Ionic vs React Native
Z przedstawionych tu możliwości najbardziej przypadły mi do gustu dwa: Ionic oraz React Native. Za jednym i drugim rozwiązaniem stoi bardzo silna społeczność i bogata baza gotowych funkcjonalności.
Oba frameworki wykorzystują również znane i bardzo dobre technologie:
- Ionic – Cordova i AngularJS od Google
- React Native – React od Facebooka.
Ponieważ obie technologie spełniają moje oczekiwania, przed ostateczną decyzją przeprowadzę jeszcze jeden test. Napiszę dwie proste aplikacje realizujące tę samą funkcjonalność w obu technologiach. Framework, z którego będzie mi się lepiej korzystało, zostanie wykorzystany do projektu StormSnapshot.
20+ BONUSOWYCH materiałów z programowania
e-book – „8 rzeczy, które musisz wiedzieć, żeby dostać pracę jako programista”,
e-book – „Java Cheat Sheet”,
checklista – „Pytania rekrutacyjne”
i wiele, wiele wiecej!
4 Comments
Super! Mam stronę www i akurat będę potrzebował appki natywnej jak najtańszym kosztem wytworzonej, więc pewnie skorzystam z któregoś frameworka 🙂 robiłem mały przegląd samemu i najbardziej mi się podobał Ionic, jestem ciekaw testów
Cześć Patryk. Na pierwszy ogień poszedł React i wstępnie wygląda to bardzo zachęcająco. Niedługo wrzucę tekst z przykładową aplikacją.
Natomiast o samym Ionicu też słyszałem sporo dobrego.
Cześć,
Przy wszystkich tych framework’ach jest mowa tylko o HTML, CSS, JS. We wstępie natomiast jest wspomniana Java a propos stosu technologicznego.
Hipotetycznie jeżeli mam backend strony www zrobiony w J2EE lub Java Spring a front w technologiach webowych, to czy da się użyć powiedzmy Cordovy do opakowania mojej apki www i zrobienia z niej apki mobilnej?
Pozdrawiam
Cześć Marcin! Jak najbardziej się da i jest to bardzo częsty wzorzec.
W tym podejściu musisz jednak mieć bardzo wyraźnie rozdzielony backend od frontendu.
Jako backend piszesz sobie np. usługi restowe, które będą udostępnione przez serwer aplikacji. Natomiast część frontendową opakowujesz w Cordovę, dzięki czemu masz aplikację mobilną. Taka aplikacja potrzebuje dostępu do Internetu, żeby dostać się do tych usług.