Hummingbird vs Angular Dart

Hummingbird został ogłoszony na imprezie startowej fluttera 4 grudnia. Projekt, który pozwoli nam skompilować nasze aplikacje flutterowe w pełnoprawne Progressive Web Apps. Więc… czy Angular Dart nadal jest tego warty?

Postaram się podzielić tym, ile do tej pory zebrałem, mając nadzieję, że moje wnioski pomogą również innym.

Pierwszym pytaniem jest to, czy faktycznie możemy korzystać z tych dwóch.

Angular Dart
Obecna wersja AngularDart to 5.2.0. Jest stabilna (już od kilku lat), używana w projektach Google o dużym wpływie i w projektach na całym świecie.

Hummingbird
Niektórzy twierdzą, że hummingbird jest obecnie w wersji alfa. Jednak wszystko, co mamy, to przegląd techniczny. Bardziej propozycja niż cokolwiek innego, gdzie zespół dokładnie omówił techniczne kierunki, które rozważają. (TUTAJ: https://medium.com/flutter-io/hummingbird-building-flutter-for-the-web-e687c2a023a8)

Co oni właściwie robią?

Glad you asked! Postaramy się zrozumieć czym są Single Page Applications, czym są Progressive Web Applications i przyjrzymy się oczekiwanym wyjściom Angulara i Hummingbirda. To pomoże nam zrozumieć problemy, które zamierzają rozwiązać.

SPAs vs PWAs

Single Page Applications

Aplikacja jednostronicowa (SPA) jest aplikacją internetową lub witryną internetową, która wchodzi w interakcję z użytkownikiem poprzez dynamiczne przepisywanie bieżącej strony zamiast ładowania całych nowych stron z serwera. – Wikipedia

Znak # zawarty w adresach URL, zamiast powodować przeładowanie strony, spowoduje pewną interakcję w obrębie strony. SPA wykorzystują tę cechę przeglądarki.

Na przykład w Wikipedii, jeśli klikniemy na nagłówek w indeksie, zamiast przeładowania strony przeglądarka przeniesie nas do tej sekcji strony.

• Przejdź do https://www.wikiwand.com/en/Single-page_application#/Ajax
• Zmień Ajax na Websockets i naciśnij enter.
• Czy strona się przeładuje? Nie. To będzie po prostu zmiana konfiguracji

SPA przenoszą to na wyższy poziom. Cała aplikacja i wszystkie jej ekrany działają z jednej strony przy użyciu #opartych na adresach URL dla wszystkich ich funkcjonalności.

PWA

Progresive Web Apps to doświadczenia użytkownika, które mają zasięg sieci, a także są niezawodne, szybkie i angażujące

– developers.google.com

PWA to strony internetowe (mogą być zwykłymi stronami lub aplikacjami jednostronicowymi), które są zoptymalizowane w taki sposób, że

• Pracują niezawodnie zarówno w trybie offline, jak i z zawodnym internetem (Lie-Fi)
• Są szybkie, zoptymalizowane pod kątem wysokiej postrzeganej wydajności
• Engaging – Poczuj się jak w natywnej aplikacji i nie mniej.

Co robi AngularDart?
AngularDart lub Angular w ogóle jest frameworkiem do pisania SPA. Zapewnia programistom sposób na pisanie SPA z funkcjami takimi jak:

• Bidirectional Data Binding
• Routing
• Templating
• Directives

I wiele więcej. Rzeczywisty UI jest nadal pisany za pomocą HTML + CSS. Angular jedynie dostarcza wszystko inne, co pozwala programistom internetowym rozwijać ich SPA. Główny punkt to:

• Angular Dart nie jest frameworkiem UI
• Aplikacje Angular Dart mogą lub nie mogą być PWA

Czym więc są Angular Web Components?
Jest to grupa komponentów Material Design dostarczanych przez pakiet angular_components, które działają jako szablony do budowania aplikacji.

• Nie są obsługiwane w Internet Explorerze
• Ciągle są napisane w HTML + CSS + Dart

Co zrobi Hummingbird?
Jak na razie to tylko spekulacje. Jego celem będzie przekształcenie dowolnej aplikacji flutterowej w PWA. Może, ale nie musi być SPA (najprawdopodobniej będzie). Jednak będzie starał się robić wszystko to, co robi Flutter.

Dzięki niemu moglibyśmy używać Flutter UI Framework, używać wszystkich funkcji Flutter SDK, takich jak widżety zarządzania stanem i wszystko… i jednym kliknięciem stworzyć PWA obok aplikacji na Androida i iOS, które już mamy!

Po drodze jest wiele wyzwań, ale jeśli Google to zrealizuje, będzie to be the be all of SDKs.

Stan All-Dart Apps

Lets try to understand the difference between Flutter + AngularDart and Flutter + Hummingbird combinations if we were to write an all-dart zestaw aplikacji dla stron internetowych i natywnych.

TERAŹNIEJSZOŚĆ: Flutter + Angular Dart
Do napisania takiej aplikacji będziemy potrzebowali:

• Napisać pakiet core zawierający całą logikę biznesową, zapewniając, że nie posiada on zależności angularowych ani flutterowych, a wszystkie takie zależności są wstrzykiwane do niego z zewnątrz
• Napisać Angularowe PWA subskrybujące rdzeń dla wszystkich funkcjonalności
  * UI z HTML + CSS lub komponowanie komponentów angularowych
  * Routing, zarządzanie stanem z Angularowym sposobem robienia rzeczy
• Napisz aplikację Fluttera subskrybującą ten sam rdzeń dla wszystkich funkcjonalności
  * UI z flutterowym frameworkiem UI
  * Routing, zarządzanie stanem itp. z flutterowym sposobem robienia rzeczy
• Kompiluj do iOS i Androida z projektu flutera
• Kompiluj do Web z projektu Angulara

Czy współdzielenie kodu zmniejsza ilość pracy?
Choć współdzielenie kodu zdecydowanie zmniejsza „ilość kodu”, z mojego doświadczenia wynika, że tak naprawdę nie zmniejszyło to ilości pracy, którą trzeba wykonać. Wymaga to ode mnie bycia o wiele bardziej przemyślanym w tym procesie.

Jakie są zatem korzyści?

• Kod jest czystszy, a architektura lepsza
• Jestem zmuszony i łatwiej mi teraz utrzymać parytet funkcji na różnych platformach.

THE FUTURE: Flutter + Hummingbird
Do napisania takiej aplikacji będziemy musieli:

• Napisać aplikację flutter
  * UI z frameworkiem flutter
  * Routing, State Management etc the flutte way
• Kompilować na trzech różnych platformach
• Done.

Czy to mniej pracy?
Hell yeah!

Konkluzja

I oto jest. Zestawienie tego, co wiemy o flutterze, angular dart, hummingbird i dzieleniu się kodem między sobą.

Jeśli teraz coś rozwijasz…
Wybierz flutter + angular dart. Nie jest to tak łatwe, jak marzenie o kolibrze, ale nadal jest to najlepsza droga do zrobienia.

Hummingbird jak na razie jest odległym marzeniem. Projekt, który powinniśmy zdecydowanie mieć nadzieję na spełnienie się pewnego dnia i wspierać go wszystkimi naszymi wysiłkami, ale Dilli abhi door hai (ta przyszłość jest odległa).