Hummingbird vs Angular Dart

Hummingbird tillkännagavs vid lanseringen av Flutter den 4 december. Ett projekt som kommer att göra det möjligt för oss att kompilera våra flutter-applikationer till fullfjädrade Progressive Web Apps. Så… är Angular Dart fortfarande värt det?

Jag ska försöka dela med mig av hur mycket jag har samlat på mig hittills, i hopp om att mina upptäckter hjälper andra också.

Den första frågan är om vi faktiskt kan använda de två eller inte.

Angular Dart
Aktuell version av AngularDart är 5.2.0. Den är stabil(har varit det i några år nu), används i Googles projekt med stor genomslagskraft och i projekt runt om i världen.

Hummingbird
Vissa skulle hävda att hummingbird för närvarande befinner sig i alfafasen. Allt vi har är dock en teknisk översikt. Mer av ett förslag än något annat där teamet grundligt diskuterade de tekniska inriktningar som de överväger. (HÄR: https://medium.com/flutter-io/hummingbird-building-flutter-for-the-web-e687c2a023a8)

Vad gör de egentligen?

Glad att du frågade! Vi ska försöka förstå vad enkelsidiga applikationer är, vad progressiva webbapplikationer är och titta på de förväntade resultaten av Angular och Hummingbird. Detta kommer att hjälpa oss att förstå de problem som de avser att lösa.

SPAs vs PWAs

Single Page Applications

En single page application (SPA) är en webbapplikation eller webbplats som interagerar med användaren genom att dynamiskt skriva om den aktuella sidan i stället för att ladda in hela nya sidor från en server. – Wikipedia

Tecknet # när det ingår i webbadresser kommer, i stället för att orsaka att sidan laddas om, att orsaka viss interaktion inom sidan. SPA:er utnyttjar den här webbläsarfunktionen.

I Wikipedia till exempel, om vi klickar på en rubrik i indexet, tar webbläsaren oss till det avsnittet av sidan i stället för att sidan laddas om.

• Gå till https://www.wikiwand.com/en/Single-page_application#/Ajax
• Ändra Ajax till Websockets och tryck på enter.
• Kommer sidan att laddas om? Nej, den ändrar bara konfigurationen

SPA:s tar detta till nästa nivå. Hela applikationen och alla dess skärmar fungerar från en enda sida och använder #baserade webbadresser för alla funktioner.

PWAs

Progressive Web Apps är användarupplevelser som har webbens räckvidd och är tillförlitliga, snabba och engagerande

– developers.google.com

PWAs är webbplatser (kan vara vanliga webbplatser eller enkelsidiga appar) som är optimerade på ett visst sätt så att de

• Fungerar på ett tillförlitligt sätt både offline och med opålitligt internet (Lie-Fi)
• Är snabba, optimerade för hög upplevd prestanda
• Engagerande – Känns som en inhemsk applikation och inte mindre.

Vad gör AngularDart?
AngularDart eller Angular i allmänhet är ett ramverk för att skriva SPA:er. Det ger utvecklare ett sätt att skriva SPAs med funktioner som:

• Bidirektionell databindning
• Routing
• Templating
• Directives

Och mycket mer. Själva användargränssnittet är fortfarande skrivet med HTML + CSS. Angular tillhandahåller bara allt annat som gör det möjligt för webbutvecklare att utveckla sina SPA:er. Huvudpoängen är:

• Angular Dart är inte ett UI Framework
• Angular Dart appar kan eller kan inte vara PWAs

Vad är Angular Web Components då?
Det är ett gäng materialdesignkomponenter som tillhandahålls av angular_components-paketet som fungerar som mallar för att bygga applikationer med.

• De stöds inte i Internet Explorer
• De är fortfarande skrivna i HTML + CSS + Dart

Vad kommer Hummingbird att göra?
Här är det än så länge bara spekulationer. Den kommer att syfta till att omvandla vilken flutterapplikation som helst till en PWA. Det kan eller kan inte bli en SPA (det kommer det med största sannolikhet att bli). Men den kommer att försöka göra allt som Flutter gör.

Med den kan vi använda Flutter UI Framework, använda alla funktioner i Flutter SDK, t.ex. widgetar för tillståndsstyrning, och med ett enda klick producera en PWA vid sidan av de Android- och iOS-applikationer som vi redan har!

Det finns många utmaningar på vägen, men om Google inser det här kommer den att bli SDK:s allt-i-ett.

Status för All-Dart Apps

Låtsas vi försöka förstå skillnaden mellan Flutter + AngularDart och Flutter + Hummingbird-kombinationerna om vi skulle skriva en all-dart uppsättning applikationer för webb och native.

HELST NU: Flutter + AngularDart
För att skriva en sådan applikation kommer vi att behöva:

• Skriva ett kärnpaket som innehåller all affärslogik, se till att det inte har angular- eller flutter-beroenden och att alla sådana beroenden injiceras till det utifrån
• Skriva Angular PWA som prenumererar på kärnan för alla funktionaliteter
  * UI med HTML + CSS eller sammansättning av angular-komponenter
  * Routing, State Management med Angularmetoden
• Skriv en Flutter-applikation som prenumererar på samma kärna för alla funktioner
  * UI med flutter UI-ramverket
  * Routing, State Management etc. med fluttermetoden
• Kompilera till iOS och Android från flutterprojektet
• Kompilera till webben från Angularprojektet

Minskar koddelning arbetsmängden?
Men koddelning minskar definitivt ”mängden kod”, men enligt min erfarenhet har det inte riktigt minskat mängden arbete som behöver göras. Det kräver att jag är mycket mer genomtänkt genom processen.

Vad är fördelarna då?

• Koden är renare och arkitekturen är bättre
• Jag är tvungen att, och det är lättare för mig att bibehålla funktionalitetsparitet mellan olika plattformar nu.

FRAMTIDEN: Flutter + Hummingbird
För att skriva en sådan applikation måste vi:

• Skriva en Flutter-applikation
  * UI med Flutter-ramverket
  * Routing, State Management etc. på Flutter-sättet
• Kompilera på tre olika plattformar
• Gjort.

Är det mindre arbete?
Hell yeah!

Slutsats

Där har vi det. En sammanfattning av vad vi vet om flutter, angular dart, hummingbird och att dela kod med varandra.

Om du utvecklar något just nu…
Satsa på flutter + angular dart. Det är inte lika enkelt som hummingbird-drömmen, men är ändå den bästa vägen att gå.

Hummingbird är från och med nu en avlägsen dröm. Ett projekt som vi definitivt bör hoppas på att förverkliga en dag och stödja med alla våra ansträngningar, men Dilli abhi door hai (den framtiden är avlägsen).