Programmierung der Mini-App

In diesem Kapitel möchte ich auf die Lektionen eingehen, die ich aus der Recherche von Mini-Apps aus der Sicht von Webentwicklern gelernt habe, oder die Frage beantworten, was es bedeutet, Mini-Apps zu entwickeln.

Anstatt das Rad neu zu erfinden und Entwickler dazu zu bringen, eine weitere Implementierung gängiger UI-Paradigmen wie Tabs, Akkordeons, Karussells usw. zu erstellen, werden Mini-Apps einfach mit einer Standardauswahl von Komponenten ausgeliefert, die bei Bedarf erweitert werden können. Im Web gibt es ebenfalls viele Optionen. Einige davon habe ich im Kapitel zu Mini-App-Komponenten aufgeführt. Idealerweise wurden Komponentenbibliotheken im Web so erstellt, dass man sie frei mischen konnte. In der Praxis gibt es zu oft eine gewisse Bindung an ein Designsystem, das Sie übernehmen müssen, wenn Sie eine Komponente verwenden, oder die Komponentenbibliothek wird so verteilt, dass alles oder nichts ist, aber einzelne Komponenten können einem Projekt nicht einfach hinzugefügt werden. Es gibt jedoch atomare Komponenten, die Sie isoliert verwenden können, oder Bibliotheken wie generic-components, die absichtlich nicht formatiert wurden. Es scheint eine gute Idee zu sein, diese zu nutzen.

Modellansicht-Ansichtsmodell

Das Architekturmuster model-view-viewmodel (MVVM), das die Trennung der Entwicklung der grafischen Benutzeroberfläche (die Ansicht) über eine Auszeichnungssprache von der Entwicklung der Backend-Logik (das Modell) ermöglicht, bedeutet, dass die Ansicht nicht von einer bestimmten Modellplattform abhängt. Es gibt zwar einige Nachteile des Musters dokumentiert, aber im Allgemeinen funktioniert es sehr gut bei Anwendungen mit der Komplexität von Mini-Apps. Das glänzen vor allem in umfangreichen Vorlagenbibliotheken (siehe nächstes Kapitel).

Seitenweises Denken

Das Debugging von Mini-Apps zeigt, dass es sich im Wesentlichen um mehrseitige Anwendungen (MPA) handelt. Dies bietet viele Vorteile, beispielsweise eine einfache Weiterleitung und ein konfliktfreies Gestalten pro Seite. Viele Menschen haben MPA-Architekturen erfolgreich auf progressive Web-Apps angewendet. Das Denken in Seiten hilft auch bei der Verwaltung von Ressourcen wie den CSS- und JavaScript-Dateien jeder Seite sowie anderer Assets wie Bilder und Videos. Am wichtigsten ist jedoch, dass Sie bei der Erstellung dieser Methode eine kostenlose routenbasierte Codeaufteilung erhalten, wenn Sie nichts anderes laden. In diesem Fall wird auf jeder Seite grundsätzlich nur das geladen, was für die Funktion erforderlich ist.

Build-Prozess

Mini-Apps haben keinen sichtbaren Build-Prozess. Im Internet nutzen moderne Build-Tools wie Snowpack das integrierte Modulsystem von JavaScript (ESM), um unnötige Arbeit zu vermeiden und schnell zu arbeiten, egal wie groß ein Projekt wird. Technologien wie Web Bundles stehen zwar noch in der Anfangsphase, können aber problemlos in den Build-Prozess aufgenommen werden.

Leistungsstarke Funktionen

Die Webplattform hat in letzter Zeit viele neue Funktionen gewonnen. Der Zugriff auf Geräte über Bluetooth, USB, HID, serial und NFC ist ab sofort möglich. Wenn Mini-Apps in WebViews ausgeführt werden und von einer JavaScript-Bridge abhängen, sind diese leistungsstarken Funktionen direkt im Web verfügbar. Sie müssen also nicht mit einer API programmieren, die von der JavaScript Bridge bereitgestellt wird, sondern mit der Browser-API ohne fortgeschrittenen Nutzer.

Danksagungen

Dieser Artikel wurde von Joe Medley, Kayce Basques, Milica Mihajlija, Alan Kent und Keith Gu verfasst.