Abend 22: 09.11.2016 SPA 3 Fallstudie

Vorteile:

•     «Write once – run anywhere»
•     Einheitliche Code-Basis
•     Einsatz von Web Technologien (HTML5, CSS, Javascript etc)
•     Erhebliche Kostenersparnis (Entwicklungs-/Testaufwand)
•     Schnellere Entwicklungszyklen
•     Riesige Zielgruppe kann einfach erreicht werden

Nachteile:

• Schlechtere Performance v.a. bei hoher Rechnerleistung (Games etc)
• Einschränung des Designs (in iOS müssen die Navigationselemente unten im Bildschirm sein, bei Android oben im Bildschirm)
• Nur Teilmenge der nativen Funktionalität vorhanden
• Neueste native Funktionalität steht immer erst später via CPT zur Verfügung --> Wettbewerbsnachteil
• Abhängigkeit von Plattformhersteller: entscheidet z.B. Apple, keine CPT mehr zu unterstützen müsste man eine neue iOS-App entwickeln.

Zu klärende Anforderungen und Aspekte für den Einsatz von Cross Platfrom Development:    

• Anforderungen:

        - Plattform – Welche Plattformen muss die App unterstützen und welche sind nicht entscheidend
        - Funktionalität – Welche Endgeräte Features muss die App unterstützen und welche sind nicht entscheidend
        - Performance – Wie wichtig sind die Grafik-Anforderungen und die benötigte Rechnerleistung
        - UX/Design – Wie unterschiedlich sind die Designs für die unterschiedlichen Apps

• Verfügbares Budget
• Vorkenntnisse des Entwicklerteams
• Schnellere Entwicklungszyklen
• Einfachere Wartbarkeit (eine einzige Codebasis)

Angular Universal ist eine Erweiterung von Angular2 für serverseitiges Rendering

Einsatzmöglichkeiten:

- Es kann für ein serverseitiges Rendering der Startseite genutzt werden um die Ladezeit der Landingpage zu verbesssern
- Verbesserungen für die Indexierung durch Search Engines

• Testaufbau (Arrange)
• Ausführung (Act)
• Verifizierung (Assert)

Komponenten-Direktive: Direktive mit einem Template

Struktur-Direktive: Ändert das DOM-Layout durch Hinzufügen oder entfernen von Elementen

Bsp: ngIf, ngFor

Attribut-Direktive: verändern das Aussehen oder das Verhalten eines Elements. Werden als Attribute der Elemente verwendet.

Ändert die Struktur der Anzeige:

Wie's der Name schon sagt "beobachtet" ein Observable Objekte und reagiert auf Änderungen dieser Objekte.

Mit der Methode subscribe kann man sich an einem Observable anmelden und wird dann vom Observable benachrichtigt, wenn sich das überwachte Objekt ändert.

Beispiele:

Asynchrone Kommunikation zwischen Client und Server.

Interaktion zwischen Komponenten (shared Services)

So lange, wie sie im Browser angezeigt bleibt.