Was bei Mini-Apps gut funktioniert hat
In diesem Kapitel möchte ich auf die Erkenntnisse eingehen, die ich aus der Recherche zu Mini-Apps aus der Sicht eines Webentwicklers gewonnen habe, oder die Frage beantworten, was es bedeutet, Mini-Apps zu entwickeln.
Komponenten
Anstatt das Rad neu zu erfinden und Entwickler dazu zu bringen, noch eine weitere Implementierung gängiger UI-Paradigmen wie Tabs, Akkordeons, Karussells usw. zu erstellen, werden Mini-Apps einfach mit einer Standardauswahl von Komponenten geliefert, die erweitert werden kann, falls Sie mehr benötigen. Im Web gibt es ebenfalls viele Optionen, von denen einige im Kapitel zu Mini-App-Komponenten aufgeführt sind. Idealerweise wären Komponentenbibliotheken im Web so konzipiert, dass sie frei kombiniert werden können. In der Praxis ist es leider zu oft so, dass Sie sich an ein Designsystem binden müssen, wenn Sie eine Komponente verwenden möchten, oder dass die Komponentenbibliothek so verteilt ist, dass es nur „alles oder nichts“ gibt, aber keine einzelnen Komponenten einem Projekt einfach hinzugefügt werden können. Es gibt jedoch atomare Komponenten, die Sie einzeln verwenden können, oder Bibliotheken wie generic-components, die bewusst ohne Stil sind. Es scheint eine gute Idee zu sein, diese zu finden und zu verwenden.
Modell-Ansicht-Modellansicht
Das Architekturmuster Modell-Ansicht-Modell (MVVM) ermöglicht die Trennung der Entwicklung der grafischen Benutzeroberfläche (der Ansicht) über eine Markup-Sprache von der Entwicklung der Back-End-Logik (dem Modell). Das bedeutet, dass die Ansicht nicht von einer bestimmten Modellplattform abhängig ist. Es gibt zwar einige dokumentierte Nachteile des Musters, aber im Allgemeinen funktioniert es sehr gut für Anwendungen mit der Komplexität von Mini-Apps. Sie eignet sich besonders für umfangreiche Vorlagenbibliotheken (siehe nächstes Kapitel).
Seitenbezogen denken
Beim Debuggen von Mini-Apps zeigt sich, dass es sich im Grunde um mehrseitige Anwendungen (Multi-Page Applications, MPA) handelt. Das hat viele Vorteile, z. B. einfaches Routing und konfliktfreies Styling pro Seite. MPA-Architekturen wurden bereits erfolgreich auf progressive Web-Apps angewendet. Wenn Sie in Seiten denken, können Sie auch Ressourcen wie die CSS- und JavaScript-Dateien der einzelnen Seiten sowie andere Assets wie Bilder und Videos besser verwalten. Das Wichtigste ist, dass Sie auf diese Weise kostenlos eine routenbasierte Code-Spaltung erhalten, wenn Sie nichts anderes laden. In diesem Fall wird auf jeder Seite per Definition nur das geladen, was für die Funktion erforderlich ist.
Build-Prozess
Bei Mini-Apps gibt es keinen sichtbaren Build-Prozess. Im Web nutzen moderne Build-Tools wie Snowpack das integrierte Modulsystem von JavaScript (ESM), um unnötige Arbeit zu vermeiden und unabhängig von der Größe eines Projekts schnell zu bleiben. Technologien wie Web-Bundles befinden sich noch in der Anfangsphase, können aber ganz einfach in den Build-Prozess eingebunden werden.
Leistungsstarke Funktionen
Die Webplattform hat vor Kurzem viele neue Funktionen erhalten. Der Zugriff auf Geräte über Bluetooth, USB, HID, seriell und NFC ist jetzt möglich. Mini-Apps werden in WebViews ausgeführt und sind von einer JavaScript-Bridge abhängig. Im Web sind diese leistungsstarken Funktionen direkt verfügbar. Sie programmieren also nicht gegen eine API, die von der JavaScript-Bridge bereitgestellt wird, sondern gegen die Browser-API ohne Zwischenhändler.
Danksagungen
Dieser Artikel wurde von Joe Medley, Kayce Basques, Milica Mihajlija, Alan Kent und Keith Gu geprüft.