Zrozumienie specyfiki Fluttera może być wyzwaniem, jeśli nie orientujesz się za dobrze w technikaliach związanych z rozwojem aplikacji.
Pełniąc rolę product ownera lub product managera, warto jednak znać przynajmniej podstawowe fakty o tej technologii.
Na naszym blogu omawialiśmy już wady i zalety Fluttera i dzieliliśmy się różnymi wskazówkami dla programistów.
Tym razem podchodzimy do tego tematu od innej strony i zadajemy podstawowe pytanie — czym jest Flutter?
Ten artykuł jest dla osób, które chcą:
- wybrać najlepszą technologię do swojego projektu,
- zrozumieć, jak działa Flutter,
- poznać główne różnice pomiędzy Flutterem a React Native’em,
- otrzymać odpowiedzi na najważniejsze pytania związane z rozwojem aplikacji we Flutterze.
Jeśli uważasz, że takie informacje mogą Ci się przydać, zapraszamy do lektury.
Najważniejsze informacje
- Flutter to SDK, które pozwala tworzyć różnego rodzaju aplikacje za pomocą jednej bazy kodu.
- Dzięki Flutterowi zbudujesz aplikacje mobilne, webowe, desktopowe, a nawet aplikacje na urządzenia wbudowane.
- Flutter został opublikowany przez Google’a w 2017 roku i od tego czasu zdobył niemałą popularność, ponieważ pozwala szybko budować aplikacje i dzielić kod pomiędzy różnymi platformami.
- Flutter bazuje na języku programowania Dart, który umożliwia m.in. szybki rozwój aplikacji i wspiera sound null safety.
- Porównując Fluttera z jego popularną alternatywą, technologią React Native, widzimy znaczące różnice. Flutter często zapewnia lepszą wydajność, ponieważ nie potrzebuje mostu, żeby komunikować się z natywnymi elementami, co powoduje szybszą kompilację.
- Flutter oferuje też bogaty wybór widżetów, a dzięki opcji hot reload programiści mogą sprawdzać, jak wygląda aplikacja zaraz po wprowadzeniu przez nich zmian.
- Widżety odgrywają kluczową rolę we flutterowych aplikacjach, ponieważ programiści korzystają z nich, żeby budować interfejs użytkownika.
- Architektura Fluttera w przypadku aplikacji mobilnych i desktopowych składa się z kilku warstw – embeddera, silnika renderującego i frameworka Fluttera. Model architektury aplikacji webowych jest inny.
Czym jest Flutter?
Flutter to SDK (software development kit), który pozwala rozwijać różnego typu aplikacje przy wykorzystaniu jednej bazy kodu. Są to aplikacje:
- mobilne (iOS, Android),
- webowe,
- desktopowe (Windows, macOS, Linux),
- na urządzenia wbudowane (np. IoT).
Aby lepiej zrozumieć tę definicję, trzeba wiedzieć, że SDK to narzędzia dla programistów, które służą do tworzenia i debugowania aplikacji.
W praktyce oznacza to, że Flutter umożliwia współdzielenie znacznej ilości kodu (ale nie 100%) pomiędzy aplikacjami na różne platformy. W rezultacie nie trzeba pisać każdej z nich od zera, co przyspiesza proces rozwoju produktu.
Flutter to względnie nowa technologia cross-platformowa. Google po raz pierwszy opublikował ją w 2017 roku, a w 2018 udostępniono stabilną wersję. Ostatnie wydanie, Flutter 3.22, pojawiło się w maju 2024 roku.
Flutter to open-source’owy framework, dlatego każdy może edytować jego kod źródłowy i go ulepszać. Flutterowa społeczność ciągle się rozrasta, co umożliwia szybki rozwój tej technologii i usprawnia rozwiązywanie błędów.
- Jeśli chcesz dowiedzieć się więcej, poznaj naszą serię Flutter News i poczytaj o najważniejszych aktualizacjach Fluttera. Na przykład w grudniu 2024 roku opublikowano wersję 3.27, która oferuje nowe rozwiązania. Zwiększają one efektywność pracy programistów i poprawiają wydajność aplikacji.
Czy Flutter to język programowania?
Dart jest językiem programowania, na którym opiera się Flutter. To obiektowy język typu type-safe, który wspiera sound null safety. Dzięki temu pozwala uniknąć trudnych do usunięcia błędów związanych ze zmiennymi o wartości null.
Dart umożliwia szybszy rozwój aplikacji i ułatwia testowanie oraz debugowanie. Głównie dzięki kompilerowi JIT (Just-in-Time) i funkcji hot reload, która pozwala wyświetlać zmiany w interfejsie użytkownika w czasie rzeczywistym.
Ponadto przed publikacją aplikacja zostaje skomplikowana w trybie AOT (Ahead-of-Time) do kodu natywnego dostosowanego do platformy. Dzięki temu nie jest potrzebny most do komunikacji z komponentami systemu operacyjnego. To jedna z najważniejszych zalet Darta, która zapewnia mu przewagę nad innymi językami do tworzenia aplikacji cross-platformowych.
Flutter czy React Native?
Popularną (i starszą) cross-platformową alternatywą dla Fluttera jest React Native, który wykorzystuje język JavaScript. Obie technologie są reaktywnymi frameworkami, które automatycznie aktualizują UI i dostosowują go do zmian w stanie aplikacji.
Pomiędzy tymi frameworkami są jednak istotne różnice. Przede wszystkim Flutter często zapewnia lepszą wydajność. W przeciwieństwie do React Native’a Flutter nie potrzebuje mostu, żeby łączyć się z natywnymi elementami platformy, co skraca czas kompilacji. W efekcie aplikacja może działać szybciej.
Na dodatek Flutter oferuje szeroki wybór widżetów, a dzięki opcji hot reload programista może natychmiast zobaczyć efekty swojej pracy.
Automatyczne aktualizacje Fluttera również są nie bez znaczenia. Wprowadzanie zmian w React Native’ie nie jest równie proste.
Wszystkie te czynniki sprawiają, że flutterową aplikację można szybciej opublikować, co z perspektywy biznesu stanowi ważną zaletę.
Popularność React Native’a i Fluttera
React Native może się pochwalić większą społecznością niż Flutter, poza tym więcej programistów zna język JavaScript niż Dart, dlatego nauka React Native’a przychodzi im łatwiej. Jak wynika z ankiety Stack Overflow Survey 2023, Dart jest mniej popularny niż JS.
Należy przy tym zaznaczyć, że JavaScript ma szersze zastosowanie i jest wykorzystywany nie tylko w przypadku technologii React Native czy React, podczas gdy Dart przydaje się głównie we Flutterze.
Z drugiej strony ta sama ankieta pokazuje, że sam Flutter jest popularniejszy niż React Native (9.12% vs. 8.43% w kategorii Other frameworks and libraries). Według danych Statista Flutter był drugą najszybciej rozwijającą się technologiczną umiejętnością w 2023 roku.
Gdy spojrzysz na profile obu technologii na platformie Github, zobaczysz, że Flutter ma więcej gwiazdek niż React Native (163k vs 116k w czerwcu 2024), co oznacza, że więcej osób zaznaczyło to rozwiązanie jako ulubione. Taka popularność wskazuje, że w najbliższej przyszłości pewnie będziemy coraz częściej obserwować pojawianie się flutterowych aplikacji.
Kotlin Multiplatform jako alternatywa dla Fluttera
Czasem wymagania dotyczące projektu sprawiają, że ani Flutter, ani React Native nie wydają się korzystną opcją. Jeśli jednak mimo wszystko chcesz wykorzystać technologie cross-platformowe do budowy swojej aplikacji, istnieje trzecia opcja warta rozważenia – Kotlin Multiplatform (KMP). Ta technologia pozwala współdzielić logikę biznesową pomiędzy iOS a Androidem, ale trzeba wtedy zbudować natywne UI osobno dla każdej platformy.
- Jeśli chcesz lepiej zrozumieć, czym różni się Kotlin Multiplatform od Fluttera, zobacz nasze zestawienie i poznaj wady i zalety obu technologii.
Flutter vs natywny kod
Natywne aplikacje stanowią alternatywę dla technologii cross-platformowych, takich jak Flutter. Są rozwijane z myślą o konkretnej platformie. Natywne aplikacje w Kotlinie tworzymy na Androida, a natywne aplikacje w Swifcie działają na urządzeniach z systemem iOS. Mają mniejszy rozmiar niż cross-platformowe produkty i zapewniają natywne doświadczenia.
Z drugiej strony rozwijanie dwóch aplikacji osobno na Androida i iOS zajmuje więcej czasu i wymaga większych nakładów budżetowych niż budowa jednej aplikacji we Flutterze. Dlatego rozwiązania cross-platformowe pojawiają się na rynku szybciej.
Architektura Fluttera – podstawowe informacje
Teraz przyjrzyjmy się pewnym aspektom technicznym.
Warto wiedzieć, że Flutter składa się z kilku warstw:
1) Embedder – jest dostosowywany do każdej platformy z osobna i pisany w kilku językach, co pozwala pracować na różnych systemach operacyjnych (np. Android lub iOS). Embedder zarządza paczkami aplikacji i natywnymi wtyczkami oraz ustala porządek zdarzeń (event loop).
2) Silnik renderujący (Impeller), napisany w C/C++, rasteryzuje złożone sceny, gdy potrzebne są nowe klatki. Odpowiada też m.in. za implementację niskopoziomowego API, które leży u podstaw Fluttera.
Impeller jest obecnie domyślnym silnikiem w aplikacjach na iOS i Androida. Wcześniej taką rolę odgrywała Skia. Dlaczego postanowiono zastąpić ją Impellerem? Jest bardziej efektywny jeśli chodzi o użycie nowoczesnych graficznych API, takich jak Metal na iOS i Vulkan na Androidzie, poza tym renderuje animacje o wiele szybciej niż Skia. Umożliwia też lepsze, stabilniejsze działanie. Ponadto aplikacje z Impellerem są mniejsze, więc szybciej się aktualizują.
3) Framework Flutter — jest napisany w Darcie i składa się z warstw bibliotek wraz z konfigurowalnymi widżetami oraz API narzędzi służących do rozwijania i debugowania aplikacji.
Ten framework składa się z:
- podstawowych klas i usług bloków konstrukcyjnych
- warstwy renderującej – pozwala ona programistom tworzyć drzewa renderowalnych obiektów, które odgrywają znaczącą rolę w designie layoutu. Renderowane obiekty z tej warstwy mają odpowiadające im klasy w warstwie widżetów.
- warstwy widżetów – wszystko, co widzisz we flutterowych aplikacjach jest stworzone z bloków widżetów, bo to one budują interfejs, czyli UI. Są zhierachizowane w drzewie widżetów. Ono pokazuje, które widżety są rodzicami i nadaje kontekst. Programiści specjalizujący się we Flutterze spędzają większość czasu właśnie na pracy w widżetami. Można je dostosowywać do swoich potrzeb albo budować nowe.
StatelessWidgets i StatefulWidgets to dwa główne typy widżetów. Można je też klasyfikować na podstawie ich zastosowania. W takim przypadku otrzymujemy takie segmenty, jak np. Accessibility, Animation and Motion, Basics, Cupertino, Layout, Material Components, Styling itd.
- bibliotek Material i Cupertino – są niezbędne do implementacji elementów designu charakterystycznych dla Androida (Material Design) i iOS (Human Interface).
Aplikacje webowe
Schemat architektury opisany powyżej wygląda nieco inaczej w przypadku flutterowych aplikacji webowych.
Framework w Darcie jest kompilowany do JavaScriptu. To umożliwia pokazywanie treści w przeglądarce dzięki renderowaniu ich do HTML (przy użyciu HTML, CSS, Canvas i SVG) lub WebGL (CanvasKit). To pierwsze rozwiązanie optymalizuje rozmiar kodu, podczas gdy ostatnie zapewnia większą dokładność, a przetwarzanie graficznego stosu przeglądarki zajmuje mniej czasu.
Q&A, czyli odpowiedzi na najważniejsze pytania
Jeżeli zastanawiasz się nad wykorzystaniem Fluttera w swoim projekcie, poznaj odpowiedzi na podstawowe pytania, które znajdziesz poniżej. Powinny dać Ci lepsze wyobrażenie na temat tego, jakie możliwości daje Flutter i jakie ma ograniczenia.
Q: Czy muszę wprowadzać wszystkie funkcje na Androida i iOS w tym samym czasie?
A: Jeśli odpowiedź brzmi TAK, to znaczy, że warto dać Flutterowi szansę. Dlaczego? Kiedy rozwijasz funkcje osobno na iOS i Androida, zajmuje to więcej czasu niż wtedy, gdy wprowadzasz zmiany tylko w jednej bazie kodu.
Przykład
Masz aplikację z płatnym planem i chcesz, żeby wszyscy użytkownicy z subskrypcją otrzymywali te same funkcje. Im szybciej je dodasz, tym lepiej. W takim przypadku warto mieć flutterową aplikację, ponieważ jeden programista może stworzyć i zaimplementować wszystkie niezbędne zmiany jednocześnie.
Pamiętaj, że niektórych funkcji nie da się stworzyć wyłącznie przy użyciu SDK Fluttera. Wtedy potrzebny jest natywny kod zintegrowany z Flutterem.
Q: Jak duży budżet mogę przeznaczyć na ten projekt?
A: Na ogół Flutter jest opcją bardziej przystępną cenowo, ponieważ nie trzeba zatrudniać dwóch programistów osobno do aplikacji na system iOS i Android. Zamiast tego wystarczy jeden specjalista.
Nie oznacza to jednak, że koszt projektu będzie o połowę niższy. Testerzy muszą sprawdzić aplikację na takiej samej liczbie urządzeń, czas poświęcony na zarządzanie projektem również będzie zbliżony.
Q: Czy chcę rozwinąć aplikacje na Androida i iOS, czy wystarczy mi jedna platforma?
A: Jeśli potrzebujesz rozwiązania na tylko jedną platformę, natywna aplikacja będzie prawdopodobnie lepszym wyborem. Ta technologia zapewnia najlepszą wydajność, poza tym natywne aplikacje mają mniejszy rozmiar w porównaniu z cross-platformowymi.
Kiedy jednak potrzebne są aplikacje i na system Android, i iOS, wtedy Flutter może być dobrym rozwiązaniem, ponieważ pozwala Ci zaoszczędzić. Możesz też najpierw opublikować aplikację na Androida, a dopiero potem na iOS jeśli nie chcesz od razu wchodzić na obie platformy. Nie ma potrzeby publikowania produktów jednocześnie na platformach Google Play Store i App Store.
Q: Czy planuję stworzenie aplikacji webowej albo na PC?
A: Nawet jeśli obecnie nie potrzebujesz aplikacji webowej ani desktopowej, w przyszłości możesz zmienić zdanie. Aplikacje we Flutterze mogą być wtedy dobrą opcją, ponieważ pozwalają rozwijać produkty na nowe platformy bez potrzeby budowania od zera aplikacji webowych albo na PC/macOS. Wtedy ponownie wykorzystasz tę samą bazę kodu, której używasz na systemy iOS i Android. Oczywiście trzeba też będzie ją dostosować do nowej platformy.
Na przykład layout stworzony z myślą o aplikacji mobilnej będzie się znacząco różnił od tego, który wykorzystasz w aplikacji webowej. To samo dotyczy gestów klawiatury. Programista musi dodać i przepisać wszystkie takie elementy.
Podsumowując, wykorzystanie SDK Fluttera skróci proces rozwoju nowego produktu jeśli masz już aplikacje mobilne zbudowane we Flutterze. Wspólna baza kodu nie oznacza jednak, że aplikacje będą dokładnie takie same – zmiany są zawsze niezbędne, kiedy przechodzisz z jednej platformy na inną.
Q: Czy chcę zbudować aplikację IoT?
A: Flutter może być doskonałą opcją dla tych, których rozważają budowę aplikacji do smart TV, urządzeń gospodarstwa domowego itp. Wspiera urządzenia wbudowane, więc powinien idealnie się sprawdzić w przypadku wielu aplikacji IoT bez potrzeby sięgania po niestandardowe rozwiązania.
Musisz jednak pamiętać, że każda aplikacja IoT jest inna, a wybór Fluttera zależy od indywidualnych wymagań. Jeśli masz w planach budowę takiego oprogramowania, możesz poprosić zespół deweloperski, żeby przenanalizował Twój pomysł na produkt pod kątem technologii cross-platformowych.
Przeczytaj case study aplikacji Toyota i poznaj więcej szczegółów.
Rozwój aplikacji we Flutterze w Holdapp
Jeśli zastanawiasz się nad rozwojem aplikacji cross-platformowej, służymy pomocą. Budujemy aplikacje mobilne od 2012 roku, mamy też doświadczenie w tworzeniu aplikacji webowych. Sprawdź nasze portfolio, żeby poznać szczegóły o naszych projektach.
Zespół Holdapp był bardzo profesjonalny i łatwo się z nim pracowało. Wybraliśmy Fluttera, bo dawał nam możliwość dostarczenia cross-platformowej aplikacji w tym samym czasie. Zespół Fluttera w Holdapp był pierwszorzędny i potrafił dotrzymać naszych napiętych terminów. Odbiór aplikacji przez członków był bardzo pozytywny. Nie możemy się doczekać ponownej współpracy z zespołem.
Jak możemy Ci pomóc?
Zanim doradzimy, jaką technologię warto wybrać, przeprowadziny dogłębny research rynku i poprosimy Cię o informacje na temat Twoich potrzeb. Celem jest lepsze poznanie Twojego biznesu i branży.
Kiedy już poznamy wymagania, wybierzemy rozwiązania, które zapewnią najlepszą wydajność i będą się mieścić w granicach określonego budżetu i ram czasowych.
Dzięki temu dowiesz się, jakie kroki podjąć, żeby osiągnąć jak najlepsze rezultaty. Napisz do nas, żeby dowiedzieć się więcej.
