10 października 2022

Dzień dobry, my z Flutterem #4 – Przypadki użycia i testy wydajności

Ach, ten Flutter. Dużo się o nim mówi. Wiele zalet tego rozwiązania zostało już omówionych, wiele możliwości zostało pokazanych. Jednak na papierze i w prezentacjach PowerPoint można obiecać wszystko. Trudniej jest z udowodnieniem, że rozwiązanie będzie działać w praktyce. Czy nie jest tak, że technologia wygląda świetnie, ale żaden produkt z prawdziwego zdarzenia nie wykorzystuje Fluttera? Czy istnieją aplikacje oparte na tej technologii, z których każdy z nas może skorzystać na co dzień? Kolejna rzecz to wydajność. Czy jest ona na tyle wysoka, że użytkownik będzie miał dobre doświadczenie po spotkaniu z aplikacją? Zatem nie przedłużając…

Przykłady aplikacji

My BMW

W dwóch słowach – My BMW to aplikacja przeznaczona do zarządzania samochodem. Producent od początku swojej przygody z aplikacjami mobilnymi stawiał na odbiorców Apple. Jednak wraz ze wzrostem liczby użytkowników korzystających z Androida, postanowił otworzyć się również i na tę grupę. Chcąc posiadać jedno źródło kodu i dostarczać rozwiązania na wiele platform, dedykowane rozwiązanie nie sprawdza się najlepiej. Jednak Flutter już zdecydowanie tak! BMW zdecydowało się na dostarczenie rozwiązania we Flutterze zarówno dla odbiorców marki Mini, jak również dla użytkowników samochodów BMW. Źródło informacji: https://flutter.dev/showcase/bmw

Wallace & Gromit AR

Coś dla smakoszy łączenia świata rzeczywistego ze światem wirtualnym. Zadaniem aplikacji jest zaaranżowanie spotkania użytkownika z innowacyjnym doświadczeniem storytellingu. Ok, ale co to właściwie znaczy? Mówiąc najprościej, podczas korzystania z aplikacji, używając aparatu, możemy podejmować rywalizację z robotem, z którym gramy w piłkę, a który jest obok nas w kuchni. A to jedynie misja powitalna. Źródło informacji: https://flutter.dev/showcase/wallace-gromit-ar

Google Pay

Myślę, że aplikacji Google Pay nikomu nie trzeba przedstawiać. Ponad 100 milionów użytkowników w dziesiątkach krajów. Efekt, jaki został osiągnięty po wprowadzeniu Fluttera to zmniejszenie o 35% liczby linijek kodu, uwzględniając platformy Android i iOS oraz zredukowanie o 70% ilości potrzebnego zaangażowania niezbędnego do stworzenia rozwiązania. A jak dokładnie przebiegała droga przejścia z rozwiązań dedykowanych na daną platformę na Fluttera? O tym – w czwartym odcinku podkastu.

Źródło informacji: https://flutter.dev/showcase/google-pay

Nubank

Jak możemy przeczytać o firmie, Nubank jest największym niezależnym bankiem cyfrowym poza Azją, który daje ponad 48 milionom ludzi bezpieczny i przystępny sposób na zarządzanie swoimi finansami. Nietrudno domyślić się, że firma zdecydowała się na użycie Fluttera. W tym przypadku ciekawe jest, że przed ostateczną decyzją dotyczącą technologii, Nubank porównał różne technologie wieloplatformowe poprzez stworzenie Proof of Concept. Decyzja została podjęta na podstawie wniosków płynących zarówno z metryk, jak i od deweloperów. W mojej ocenie była to świetna decyzja. 🙂 Pełny materiał znajdziecie w raporcie Nubank.

Źródło informacji: https://flutter.dev/showcase/nubank

Testy wydajności

Aby poszerzyć znacząco wiedzę na temat danego rozwiązania, można posłużyć się metodą zmierzenia wydajności. Popatrzmy na Fluttera pod kątem:

  • wykorzystywania sensorów, zapisywania oraz odczytywania plików
  • animacji
  • obliczeń matematycznych

Wydajność pod względem korzystania z wbudowanego w telefonie modułu GPS, aparatu, zapisywania oraz odczytywania zapisanych plików

Pierwsze porównanie tyczy się zapisywania, usuwania oraz odczytywania plików. Testowy plik ważył 100 MB i był zapisywany w pamięci telefonu. W starciu wzięły udział: Java, Flutter oraz Kotlin / Native.


Grafika 1. Średnia ilość czasu potrzebna do zapisania i odczytu pliku oraz maksymalne zapotrzebowanie pamięci RAM i procesora podczas zapisu, a także kasowania pliku

Grafika 2. Średni czas potrzebny do odczytu pliku oraz maksymalne zapotrzebowanie pamięci RAM i procesora podczas odczytu pliku

Zapis oraz usuwanie – wyniki są niemalże identyczne zarówno pod względem czasu, jak i zużycia procesora. Flutter potrzebował więcej o niecałe 20% pamięci operacyjnej.  

Odczyt – Flutter średnio o ponad 40% szybciej odczytywał pliki. Aby tego dokonać, potrzebował średnio o 40 MB RAM-u więcej i zużywał średnio o 6% mniej procesora. 

W kwestii sortowania oraz zapytań Rest zapraszam do czwartego odcinka podkastu oraz do publikacji naukowej „A Comparison of Java, Flutter and Kotlin / Native Technologies for Sensor Data-Driven Applications”.

Źródło informacji oraz grafik: Wasilewski K., Zabierowski W., „A Comparison of Java, Flutter and Kotlin / Native Technologies for Sensor Data-Driven Applications”, Sensors 2021, 21, 3324

Wydajność w odniesieniu do prędkości renderowania animacji

Jeśli chodzi o tę część, mamy porównanie czterech rozwiązań: Androidowych, iOS-owych, React Native’a oraz Fluttera. Tutaj już nie czas będzie wyznacznikiem, a liczba klatek, w których wyświetlane są aplikacje. Ponadto mamy jeszcze zużycie procentowe CPU, RAM-u, ilość zużytych mAh, czyli wartość skorelowana z baterią oraz zużycie procesora graficznego.

Na pierwszy ogień weźmy listę 1000 obrazków, a dokładniej listę obrazków, którą można skrolować. W każdym przypadku tempo przewijania było takie samo.  

Grafika 3. Wyniki uzyskane na urządzeniu z systemem Android

Grafika 4. Wyniki uzyskane na urządzeniu z systemem iOS

A jeśli interesuje Cię, jak prezentuje się porównanie bardziej wymagających oraz złożonych animacji, a także porównanie 200 obrazków, które jednocześnie zmieniają się poprzez obracanie się, skalowanie oraz znikanie, mówimy o tym więcej w podkaście.

Źródło informacji oraz grafik: https://inveritasoft.com/blog/flutter-vs-react-native-vs-native-deep-performance-comparison

 

Logika biznesowa – prędkość obliczeń matematycznych i wykorzystanie pamięci

Test wydajności opiera się na obliczeniu matematycznym liczby Pi poprzez dwa różne algorytmy – Gaussa-Legendre’a oraz Borweina.

Algorytm Gaussa-Legendre’a

Grafika 5. Wydajność pamięci na podstawie algorytmu Gaussa-Legendre’a na urządzeniach z systemem iOS

 

Objective-C jest najbardziej wydajny. Najciekawsze, że Flutter poradził sobie o 15% lepiej w stosunku do rozwiązania napisanego w technologii Swift. React Native potrzebował 15 razy więcej czasu w stosunku do Fluttera. 

Grafika 6. Wydajność pamięci na podstawie algorytmu Gaussa-Legendre’a na urządzeniach z systemem Android

 

Różnica wynosi zaledwie 50 millisekund, a przedział oscyluje pomiędzy 200 a 300 ms. React Native potrzebował już 3,2 sekundy. 

Algorytm Borweina

Grafika 7. Wydajność pamięci na podstawie algorytmu Borweina na urządzeniach z systemem iOS

 

Grafika 8. Wydajność pamięci na podstawie algorytmu Borweina na urządzeniach z systemem Android

 

W przypadku tego algorytmu na iOS – Swift jest pięć razy szybszy w stosunku do Fluttera. A Flutter z kolei jest szybszy ponad trzykrotnie w stosunku do React Native’a i różnica czasu wynosi 403 ms. 

W tym przypadku Flutter wypadł całkiem nieźle na tle konkurencji. Flutter był wolniejszy o 140 ms w stosunku do Kotlina oraz Javy. Z kolei w stosunku do React Native’a był o ponad 0,5 ms szybszy.

Źródło informacji oraz grafik: https://medium.com/swlh/flutter-vs-native-vs-react-native-examining-performance-31338f081980

 

Podsumowanie

Na załączonych przykładach widać, że wiele światowych marek zdecydowało się na wybranie Fluttera. Z kolei testy wydajności pokazały w liczbach, jak prezentuje się Flutter na tle innych rozwiązań. Przedstawione informacje są małym wycinkiem materiałów na ten temat, które możemy znaleźć w Internecie w postaci artykułów czy podkastów. Po więcej szczegółów zapraszam już teraz do czwartego odcinka naszego podkastu Turn ONwelo –„Dzień dobry, my z Flutterem”.

Paweł Zawiślak – Twój ulubiony Flutter Developer 😉

 

Twórcy „Dzień dobry, my z Flutterem”

Łukasz Lotkowski – Software Architect / Programming Group Leader. W Onwelo specjalizuje się w integracji systemów oraz wszelkich rozwiązaniach mobile (Native & Multiplatform). Pasjonat technologii, który z przyjemnością wspiera biznes, pełniąc rolę łącznika pomiędzy tymi dwoma obszarami. Miłośnik automatyzacji procesów. W wolnym czasie lubi przebiec półmaraton oraz pograć na jednej z wielu konsoli, które ma w swojej kolekcji.

Paweł Zawiślak – Flutter Tech Lead w Onwelo specjalizujący się w obszarze rozwiązań wieloplatformowych, a w szczególności mobilnych. Ogromny fan technologii, psychologii oraz kreowania rzeczywistości poprzez tworzenie produktów. Lubi ludzi i wierzy, że od każdego można się czegoś nauczyć, a dzięki rowerowi wie, że może daleko zajechać.

Zostaw komentarz

Polecamy

Czym jest brand hero i jak może pomóc marce?

Czym jest brand hero i jak może pomóc marce?

Mały Głód, Serce i Rozum, ludzik Michelin – jako brand hero reprezentują oni swoje marki. W tym roku dołączył do nich Onwelek, nasz własny brand hero. Dowiedz się, czym jest brand hero, jakie pełni funkcje i jak przebiega jego kreacja!

Czym jest brand hero i jak może pomóc marce?

Czym jest brand hero i jak może pomóc marce?

Mały Głód, Serce i Rozum, ludzik Michelin – jako brand hero reprezentują oni swoje marki. W tym roku dołączył do nich Onwelek, nasz własny brand hero. Dowiedz się, czym jest brand hero, jakie pełni funkcje i jak przebiega jego kreacja!

#Udostępnij

strzałka przewiń do góry strony