Technologie

Flutter

Twój design renderowany co do piksela na iOS i Androidzie z jednej bazy kodu w Darcie. Dla produktów, w których interfejs jest produktem.

Co to jest

Flutter wydaje aplikacje na iOS i Androida z jednej bazy kodu w Darcie, ale jego prawdziwa różnica leży w sposobie rysowania: framework renderuje każdy piksel samodzielnie przez silnik Impeller, zamiast mapować interfejs na kontrolki systemowe. Twój interfejs wygląda i zachowuje się identycznie na trzyletnim Androidzie i najnowszym iPhonie, a jeden zespół prowadzi jeden backlog dla obu sklepów.

Wygrywa tam, gdzie interfejs jest produktem: konsumenckie aplikacje mocno oparte na marce, doświadczenia pełne animacji, niestandardowe design systemy, których dwukrotne budowanie byłoby drogie. Ponieważ Flutter kompiluje Darta do natywnego kodu maszynowego i kontroluje cały pipeline renderowania, wydajność jest przewidywalna, a 60 czy 120 klatek na sekundę to budżet inżynierski, nie nadzieja. Ta sama baza kodu sięga desktopu i urządzeń embedded, gdy ma to znaczenie.

Kompromisy są realne i nazywamy je po imieniu. Dart to osobna umiejętność, więc istniejący zespół Reactowy przenosi mniej niż przy React Native. Aplikacje są większe niż natywne, funkcje platformowe przechodzą przez platform channels do Swifta i Kotlina, a systemowy wygląd wymaga świadomej pracy. Mówimy przed projektem, nie w jego trakcie, czy te koszty są warte tego, co Flutter daje w zamian.

Dlaczego to działa

01

Design przeżywa obie platformy

Flutter rysuje interfejs samodzielnie, więc produkt wychodzi taki, jak go zaprojektowano: bez rozjazdów między platformami, bez niespodzianek od kontrolek OEM, z jednym przejściem QA wizualnego zamiast dwóch.

02

Wydajność jako budżet, nie nadzieja

Dart kompiluje się z wyprzedzeniem do kodu maszynowego, a Impeller renderuje bez zacięć shaderów. Budżety czasu klatki i startu ustawiamy w CI i ich pilnujemy.

03

Jeden zespół, jeden backlog

Typowe produkty współdzielą wyraźnie ponad 90 procent kodu między platformami. Funkcje trafiają do obu sklepów tego samego dnia, a błąd naprawia się raz.

04

Miejsce na wzrost poza telefony

Ta sama baza kodu celuje w desktop i ekrany embedded. Jeśli kiosk, tablet albo ekran w samochodzie jest na Twojej roadmapie, Flutter tam dotrze bez przepisywania.

Technologie

Jak z nim pracujemy

01

Najtrudniejszy ekran na początek

Najbardziej ryzykowny interfejs, firmową animację albo gęsty dashboard, budujemy jako spike w pierwszych dniach. Na nim opiera się ekonomia całego projektu, więc idzie pierwszy.

02

Design system jako kod

Tokeny marki, typografia i komponenty stają się pakietem Fluttera z żywą galerią. Projektanci recenzują realnie wyrenderowane widżety, nie przybliżenia.

03

Pionowe wycinki do obu sklepów

TestFlight i wewnętrzna ścieżka Google Play od pierwszych sprintów, za każdym razem pełny wycinek produktu. Postęp mierzymy instalowalnymi buildami.

04

Najpierw pomiar, potem optymalizacja

Czasy klatek, start i rozmiar aplikacji śledzimy w CI od pierwszego tygodnia. Gdy liczba wychodzi poza budżet, naprawiamy ją w tym samym sprincie, nie przed premierą.

Co otrzymujesz

Produkcyjne aplikacje iOS i Android z jednej bazy kodu w Darcie
Twój design system jako udokumentowany pakiet Fluttera
Integracje platform channels w Swifcie i Kotlinie, z dokumentacją
Pipeline CI/CD z automatycznym dostarczaniem do obu sklepów
Zestaw testów: jednostkowe, widżetowe i integracyjne
Raport wydajności: czas startu, budżety klatek i rozmiar aplikacji

Częste pytania

Czy aplikacja we Flutterze będzie się czuła natywnie?

Będzie się czuła jak Twój produkt i o to właśnie chodzi w aplikacjach prowadzonych designem. Flutter ma wierne zestawy widżetów Material i Cupertino, a my dostosowujemy gesty nawigacji, fizykę przewijania i haptykę pod każdą platformę. Jeśli aplikacja ma przede wszystkim wyglądać jak systemowa aplikacja Apple, uczciwą rekomendacją jest kod natywny albo Kotlin Multiplatform.

Czy o programistów Darta jest trudno?

Pula jest mniejsza niż w JavaScripcie, ale Dart to mały, typowany język, który inżynier znający TypeScript, Kotlina czy Swifta opanowuje w kilka dni. Zespoły, którym przekazujemy projekty, obsadzają role flutterowe mocnymi inżynierami mobile lub backendu, zamiast szukać słowa kluczowego w CV.

Flutter czy React Native?

Jeśli produkt jest prowadzony designem, pełen animacji albo musi renderować się identycznie wszędzie: Flutter. Jeśli masz zespół Reactowy w webie, którego kod i ludzi chcesz wykorzystać: React Native. Budujemy w obu, a rekomendację dostajesz na piśmie, z powodami, nie z preferencją.

Jak duże i szybkie są te aplikacje naprawdę?

Minimalny build produkcyjny to około 10 MB na platformę przed assetami: więcej niż natywnie, ale rzadko o czymkolwiek decyduje. W działaniu to skompilowany kod maszynowy z renderowaniem na GPU; na średniej półce Androida start i przewijanie to miejsca, w których Flutter regularnie wygrywa ze stackami interpretowanymi. Jeśli w Twojej dystrybucji liczy się każdy megabajt, policzymy, ile oszczędziłby kod natywny.

Ten sam design na każdym ekranie, bez zmian

Bezpłatna 30-minutowa rozmowa z doświadczonym inżynierem Fluttera. Przynieś swój najbardziej ryzykowny projekt ekranu; wyjdziesz wiedząc, czy Flutter utrzyma go w 60 klatkach na sekundę.

Porozmawiaj z inżynierem Fluttera