Jak nám Jetpack Compose urychlil vývoj European Coffee Trip na polovinu

Vývojáři se dříve psali při spuštění iOS appky o spuštění iOS aplikace European Coffee Trip. Tento příspěvek se zaměřuje na proces vývoje pro Android, co bylo možné převzít z iOS a jaké technologie byly použity.

Co jsme řešili už při iOS verzi

Tým kladl důraz na jednoduchost a přehlednou navigaci. Základní uživatelský scénář zahrnoval hledání specialty kaváren v okolí, proto zvolili strukturu s mapou zobrazující polohu uživatele s piny reprezentujícími kavárny — modré pro běžná místa a červené pro ty, které European Coffee Trip finančně podporují.

Aplikace udržuje offline přístup k datům o kavárnách, což je klíčové pro uživatele s omezenými datovými tarify nebo cestující mimo roamingové zóny. Klíčové otázky se týkaly počáteční velikosti stahování a frekvence aktualizací databáze.

JSON vs Protobuf

S přibližně 3 000 odhadovanými kavárnami měřila nekomprimovaná JSON data asi 3 MB. HTTP komprese to snížila na 530 KB — srovnatelné se dvěma obrázky z Instagramu. Přestože Protobuf nabízel výhody ve velikosti a struktuře, tým zvolil JSON, protože správa backendu byla externě zajišťována a JSON umožnil jednodušší implementaci a podporu webových aplikací.

Teď ta mobilní appka pro Android

Dokumentace je základ

Vývoj pro iOS odstranil mnoho starostí při tvorbě pro Android. Tým nemusel přenavrhovat datové struktury ani metadata pro invalidaci cache. Zdůrazňují: ’Sledujte kvalitu dokumentace pro komunikační kontrakty” — to urychluje návrh a budoucí implementace na dalších platformách a zároveň udržuje historii verzí.

Překlopení designu z iOS na Android

Vývoj začal přibližně dva měsíce před World of Coffee 2022 v Miláně, což přineslo technické i designové výzvy. Původní iOS design nerespektoval standardy Material Design. Pro minimalizaci nákladů na design ukázali designérovi principy Material 3 a požádali o základní rozhodnutí — barevné palety respektující specifikace Material Design. Tento přístup ušetřil čas; aplikaci sestavili především z nativních designových komponent a detaily doladili s designérem následně.

Vývoj s Jetpack Compose

Tým zvažoval mezi tradičním přístupem XML/Fragment nebo přijetím moderního nástupce. Zvolili Jetpack Compose po pozorování intenzivního komunitního vývoje a pozitivní zpětné vazby.

Jejich důvody zahrnovaly: sledování aktivního vývoje a přijetí komunitou, uznání, že opakovaně použitelné komunitní knihovny zpracovávají opakující se úkoly a šetří vývojářům čas pro implementaci nových funkcí.

Využili knihovnu Accompanist pro sledování stavu oprávnění, integraci WebView a stránkování galerie — díky níž byla implementace galerie přímočará a efektivní. Knihovna Coil efektivně zobrazovala fotografie kaváren prostřednictvím ořezávání obrázků, lazy loadingu a cachování, čímž minimalizovala opakované přenosy mobilních dat.

Mapy a Jetpack Compose

Mapy představují složité, dynamické prvky s interním stavem (aktuální poloha, rotace, náklon mapy). Google Maps dříve vyžadovaly obalení do AndroidView v rámci Compose; nyní tým Google Maps poskytuje dedikovanou knihovnu od tvůrců Google Map. Rané verze postrádaly clustering, ale tým získal přístup ke clusterovacím algoritmům z Google utils knihovny, předpočítal clustery a renderoval je podle viditelné oblasti — čímž zlepšil výkon aplikace bez přenosu všech bodů.

Zapojení komunity bylo pozoruhodné; krátce po spuštění Google přidal experimentální podporu clusteringu (bohužel po jejich vydání).

Vykreslování obrazovek

Compose vyniká efektivním renderováním. Navigační knihovny zpracovávají přechody mezi obrazovkami. Google’s Navigation knihovna funguje s Compose a uspěje při správném dependency injection pomocí nástrojů jako Hilt nebo Koin, což zajišťuje kompatibilitu ViewModelů pro efektivní správu stavu napříč obrazovkami.

Dodržovali Android best practices a implementovali Material Design 3. Některé komponenty existovaly pouze v Material Design 2, což vyžadovalo konfiguraci CompositionLocalProvider pro theming a podporu tmavého režimu. Flexibilita Material Design umožnila bezproblémovou implementaci tmavého režimu.

BottomSheetScaffold se hodí pro mapové aplikace, kde uživatelé interagují s viditelným obsahem na pozadí. Modal BottomSheet zakrývá obsah na pozadí, ideální když je potřeba soustředit pozornost uživatele na konkrétní akce jako výběr filtrů.

Pracujeme, i když spíte

Kromě HTTP cachování, které zabraňuje zbytečným stahováním databáze, využili WorkManager umožňující stahování databáze na pozadí za optimálních podmínek bez nutnosti spuštění aplikace — scénáře jako hotelové WiFi a noční nabíjení telefonu zajišťují aktualizované databáze po probuzení bez čekání přes den.

Z lásky ke kávě a mobilním aplikacím

Odhad vývoje se blížil dvěma pracovním měsícům. Tým se snažil dodat aplikaci před World of Coffee 2022 v Miláně pro globální prezentaci. Pokusili se o rychlé urychlení vývoje místo externí spolupráce.

Vývojář vytvořil částečný prototyp den před cestou do UK a dokončil funkční prototypy uprostřed letu. Aplikace poskytovala mapové body, otevírací dobu a základní informace — fundamentální, ale dostatečné pro potvrzení efektivity Compose pro efektivní vývoj.

Platí Paretův princip: ’80 % funkcionality zabere 20 % času.”

Fail na konec aka nepodceňujte schvalovací procesy

Vše proběhlo úspěšně; Jetpack Compose zkrátil dobu vývoje na polovinu oproti tradičním přístupům. Blížilo se World of Coffee 2022, pak schvalování Google Play trvalo 14 dní přes veškerou připravenost.

Co se však rozhodně povedlo:

• Jetpack Compose se ukázal jako mimořádně hodnotný, umožnil dostatečné dokončení předem
• Implementace skončila během jednoho pracovního měsíce — polovina odhadovaného času při přístupu s Fragment
• Material 3 umožnil implementaci tmavého režimu bez výrazného úsilí
• Crashlytics ukázal 3 900 instalací po třech měsících v produkci s aktivními uživateli a nulové pády kromě problémů s Google Billing
• 8 000 unikátních Android uživatelů měsíčně; 750 denně aktivních uživatelů