Ohne Netz, aber mit doppeltem Boden: Offline-First-Apps mit HTML5 und SQL Server Backend

Folien von meinem Talk im Rahmen der BASTA 2016 - Flächendeckende Mobilfunk- und Highspeed-Internet-Abdeckung klingt schön und komfortabel, doch leider entspricht es nicht immer der Realität. Ob auf dem Land, im Zug oder in großen Gebäudekomplexen: Es gibt viele Orte an denen man die Versprechen der Mobilfunkanbieter nicht allzu ernst nehmen sollte. Sicherlich schafft Ihr Device es unter großen Anstrengungen Ihnen ein GPRS- oder Edge-Signal mit einer Qualität von wenigen Prozenten bereitzustellen, doch für die meisten Apps genügt diese Verbindungsqualität schlichtweg nicht. Dank einfacher und nachvollziehbarer Architekturentscheidungen können Sie sich von der breiten Masse abheben und eine App erschaffen, die den Anwender selbst im dunkelsten Keller unterstützt. In dieser Session zeigt Ihnen Thorsten Hans, wie Sie mit HTML5 und JavaScript im Frontend und Microsofts SQL Server im Backend echte Offline-First-Anwendungen für alle Betriebssysteme erschaffen. Die damit einhergehenden Anforderungen wie Konfliktbehandlung und partielle Synchronisierung werden hierbei zentralisiert in Web-APIs gekapselt, sodass Sie die Vorteile von .NET Framework auf dem Server voll ausnutzen können.

Transcript

1. OHNE NETZ, ABER MIT DOPPELTEM BODEN OFFLINE-FIRST-APPS MIT HTML5 UND SQL SERVER BACKEND
2. OHNE NETZ, ABER MIT DOPPELTEM BODEN THORSTEN HANS Consultant @ Thinktecture AG
 https://www.xplatform.rocks http://www.thinktecture.com thorsten.hans@thinktecture.com 
 @ThorstenHans Microsoft MVP 2
3. OHNE NETZ, ABER MIT DOPPELTEM BODEN TALKING POINTS 1. Warum gibt es diesen Vortrag? 2. Wann sind wir offline? 3. Was sollte geschehen wenn wir offline sind? 4. Architekturbeispiel für Offline-Support 3
4. WARUM GIBT ES DIESEN VORTRAG? Teil 1 OHNE NETZ, ABER MIT DOPPELTEM BODEN 4
5. OHNE NETZ, ABER MIT DOPPELTEM BODEN WIR SIND IMMER ONLINE! ▸ Oftmals stimmt diese Aussage ▸ Gutes WLAN ▸ Notebooks und Desktops dominieren hier ▸ Offline-Support wird nicht benötigt ▸ Flächendeckendes, signalstarkes LTE ▸ Soll-Zustand
 ▸ In der Regel sieht es allerdings wie folgt aus … 5
6. https://www.youtube.com/watch?v=XIZVcRccCx0 6 Das Video wird natürlich nicht komplett abgespielt. es geht vielmehr um den Gag und um den Spruch der ca bei Sekunde 50 kommt
7. OHNE NETZ, ABER MIT DOPPELTEM BODEN WARUM GIBT ES DIESEN VORTRAG ▸ Endbenutzer Perspektive ▸ Millionen Apps, aber nur wenige haben Offline-Support ▸ fast täglich stärker werdende Frustration 7
8. OHNE NETZ, ABER MIT DOPPELTEM BODEN 8
9. OHNE NETZ, ABER MIT DOPPELTEM BODEN 9
10. OHNE NETZ, ABER MIT DOPPELTEM BODEN WARUM GIBT ES DIESEN VORTRAG ▸ Consultant Perspektive ▸ Eure Kunden wollen Offline-Support, auch wenn es nicht explizit erwähnt wurde ▸ Die Offline-Thematik wird unterschätzt ▸ von Entwicklern ▸ von Kunden ▸ von Product Ownern 10
11. WANN SIND WIR OFFLINE? Teil 2 OHNE NETZ, ABER MIT DOPPELTEM BODEN 11
12. OHNE NETZ, ABER MIT DOPPELTEM BODEN WANN SIND WIR OFFLINE ▸ Plattformen stellen ein Event bereit. ▸ Das Event wird gefeuert wenn ▸ das Gerät kein Signal hat ▸ das Gerät ein Signal empfängt ▸ Die Konnektivität wird binär betrachtet 12
13. OHNE NETZ, ABER MIT DOPPELTEM BODEN VERSUCHT ES SELBST Aktualisiert die Daten unterschiedlicher Apps wenn lediglich EDGE verfügbar ist. 13
14. OHNE NETZ, ABER MIT DOPPELTEM BODEN WANN SIND WIR OFFLINE? ▸ Sicherlich erinnert Ihr euch an die Zeit in der es nur EDGE gab!? ▸ Damals genügte die Übertragungsgeschwindigkeit ▸ weil eure Ansprüche unterschiedlich waren ▸ weil App Hersteller einfachere Daten übertragen haben ▸ weil App Hersteller weniger Daten übertragen haben 14
15. OHNE NETZ, ABER MIT DOPPELTEM BODEN KORREKTE ONLINE-STATUS ERKENNUNG ▸ Initial: Plattform API (optional) ▸ Falls die Plattform den Status ONLINE angibt ▸ Vordefinierte Anzahl von Requests zum Server senden ▸ Messen und einordnen der Antwortzeiten ▸ Projektabhängige Aussage über die Durchschnittsdauer treffen 15
16. OHNE NETZ, ABER MIT DOPPELTEM BODEN KORREKTE ONLINE-STATUS ERKENNUNG ▸ Einstufung der Qualität ▸ Offline ▸ ToSlow ▸ Normal ▸ Good 16 ONLINE OFFLINE
17. DEMO KORREKTE ONLINE-STATUS ERKENNUNG 17
18. WAS SOLLTE GESCHEHEN WENN WIR OFFLINE SIND? Teil 3 OHNE NETZ, ABER MIT DOPPELTEM BODEN 18
19. OHNE NETZ, ABER MIT DOPPELTEM BODEN WAS SOLLTE PASSIEREN WENN WIR OFFLINE SIND? ▸ Wichtige Fragen müssen vor der Implementierung beantwortet werden! ▸ Abhängig von den gegebenen Antworten variiert ▸ Die Architektur ▸ Der Aufwand für die Implementierung ▸ Die Komplexität der Anwendung ▸ Der Umfang der anzubietenden Funktionalitäten ▸ Das Benutzererlebnis 19
20. WAS SOLL DER BENUTZER TUN KÖNNEN WENN DAS GERÄT OFFLINE IST? Frage 1 OHNE NETZ, ABER MIT DOPPELTEM BODEN 20
21. MÜSSEN SENSIBLE DATEN OFFLINE AUF DEM GERÄT GESPEICHERT WERDEN? Frage 2 OHNE NETZ, ABER MIT DOPPELTEM BODEN 21
22. WANN MÜSSEN ÄNDERUNGEN VOM BENUTZER ZENTRAL VORLIEGEN? Frage 3 OHNE NETZ, ABER MIT DOPPELTEM BODEN 22
23. WIE SOLL MIT KONFLIKTEN BEI DER SYNCHRONISIERUNG UMGEGANGEN WERDEN? Frage 4 OHNE NETZ, ABER MIT DOPPELTEM BODEN 23
24. WIE GROSS IST DAS ERWARTETE DATENVOLUMEN JE BENUTZER / APP INSTALLATION? Frage 5 OHNE NETZ, ABER MIT DOPPELTEM BODEN 24
25. MÜSSEN DIE DATEN RELATIONAL VORGEHALTEN WERDEN? Frage 6 OHNE NETZ, ABER MIT DOPPELTEM BODEN 25
26. WIE ATOMAR MÜSSEN ÄNDERUNGEN BEHANDELT WERDEN? Frage 7 OHNE NETZ, ABER MIT DOPPELTEM BODEN 26
27. OHNE NETZ, ABER MIT DOPPELTEM BODEN WAS SOLLTE PASSIEREN WENN WIR OFFLINE SIND? ▸ Stellt diese Fragen bevor Ihr mit der Implementierung beginnt ▸ Beantwortet die Fragen ehrlich ▸ Identifiziert weitere Fragen basierend auf eurer Fachdomäne ▸ Kalkuliert die Aufwände nach jeder Änderung einer Antwort neu 27
28. ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Teil 4 OHNE NETZ, ABER MIT DOPPELTEM BODEN 28
29. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Backend (SQL) ▸ Jedes Enterprise DBMS kann verwendet werden ▸ Identifizieren Sie "Daten-Silos" ▸ Hauptentitäten die Offline gehalten werden sollen ▸ Primary Key ist eine GUID ▸ RowVersion Spalte für jede "offline" Tabelle ▸ SQL Trigger markieren Hauptentitäten für Sync 29
30. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Backend (API) ‣ HTTPS APIs stellen Daten für Sync bereit ‣ Synchronisation ‣ Komplett Sync ‣ Änderungen werden AB einer RowVersion angefordert ‣ Änderungen werden BIS zu einer RowVersion bereitgestellt 30
31. DEMO DAS BACKEND SQL + WEBAPI 31
32. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT 32
33. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Frontend ▸ TypeScript / JavaScript liefern benötigte Bestandteile ▸ Offline Datenhaltung entweder ▸ SQLite für relationale Datenhaltung ▸ IndexedDB ▸ LocalStorage für temporäre Daten ▸ ServiceWorkers* 33
34. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Frontend ▸ Wenn das Gerät offline ist ▸ Wird kein HTTPS Call getätigt ▸ Wird direkt der Offline Zustand zurückgegeben ▸ Änderungen werden lokal persistiert ▸ Eventuelle Online Features werden deaktiviert 34
35. OHNE NETZ, ABER MIT DOPPELTEM BODEN ARCHITEKTURBEISPIEL FÜR OFFLINE SUPPORT Frontend ▸ Wenn das Gerät wieder online ist ▸ Upload der lokalen Änderungen ▸ Download des Aktuellen Datenbestandes 35
36. IndexedDB WebAPI SQL Server Clients 36
37. IndexedDB WebAPI SQL Server Clients 37
38. IndexedDB WebAPI SQL Server Clients 38
39. IndexedDB WebAPI SQL Server Clients 39
40. IndexedDB WebAPI SQL Server Clients 40
41. IndexedDB WebAPI SQL Server Clients 41
42. DEMO DAS FRONTEND 42
43. WAS HABEN WIR JETZT GESEHEN?
44. OHNE NETZ, ABER MIT DOPPELTEM BODEN ZUSAMMENFASSUNG ▸ Der Offline-Support muss von Beginn an berücksichtig werden. ( OFFLINE FIRST) ▸ Betrachtet Datenübertragung, Datenhaltung, Datensensibilität und Konfliktbehandlung ▸ Setzt die vorhandenen Tools optimal ein 44
45. HTTPS://GITHUB.COM/ THORSTENHANS/BOARDZ-CROSS- PLATFORM-SAMPLE/TREE/OFFLINE
46. HABT IHR NOCH FRAGEN?
47. VIELEN DANK thorsten.hans@thinktecture.com
 @ThorstenHans