Der schwarze Schwan: Offlinefähigkeit

Der "schwarze Schwan" bezeichnet laut Nicholas Taleb ein Ereignis, das selten und höchst unwahrscheinlich ist und häufig extreme Konsequenzen nach sich zieht.
Gerade im Kontext des Enterprise-Web kann die zunehmende Anforderung der Offlinebereitstellung von umfangreichen Daten solch ein schwarzer Schwan sein.
Diese Session stellt Technologien und Möglichkeiten vor, die es ermöglichen, umfangreiche Datenmengen auch offline zur Verfügung zu stellen.

Transcript

1. Der schwarze Schwan: Offlinefähigkeit Holger Tiemeyer München, 06.02.2020 Photo by Harli Marten on Unsplash
2. 2 Photo by Harli Marten on Unsplash
3. 3 Photo by Harli Marten on Unsplash IDENTITÄT Holger Tiemeyer ARBEIT 20 Jahre Erfahrung in Enterprise- Projekten ARCHITEKT Experte in Software- architekturen seit ca. 10 Jahren KONTAKT Via Pentasys oder LinkedIn: holger.tiemeyer @pentasys.de Automotive Banking Architektur Planung Design & Entwicklung Health
4. 4 Photo by Harli Marten on Unsplash Photo by Tom Wheatley on Unsplash „Er ist immer da.“
5. 5 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash WEB-Architektur Baukasten
6. 6 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Monolithische Architektur
7. 7 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Frontend-/Asset-Server HTML Snippet Logik + Daten Multi-Page-Applikation (MPA)
8. 8 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Single Page App Logik + Daten Single-Page-Applikation (SPA) Single Page App + Logik Daten
9. 9 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash [BACKEND] Daten(haltung) [FRONTEND] Sie ist immer da.
10. 10 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash
11. 11 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Micro- service Micro- service UI Logik Datenbank Nach: „Mircoservices“ - Eberhard Wolff
12. 12 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Nach: „Mircoservices“ - Eberhard Wolff Single Page App Logik Microservice Link REST SPA pro Microservice Single Page App Logik Microservice REST
13. 13 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Nach: „Mircoservices“ - Eberhard Wolff SPA für alle Microservices Single Page App Modul Logik Microservice Modul Logik Microservice
14. 14 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Nach: „Mircoservices“ - Eberhard Wolff HTML-Anwendungen HTML Logik Microservice HTML Logik Microservice Link Router Asset Server
15. 15 Photo by Harli Marten on Unsplash Photo by Alex wong on Unsplash Nach: „Mircoservices“ - Eberhard Wolff Frontend-Server Frontend-/Asset-Server HTML Snippet Logik + Daten HTML Snippet Logik + Daten Microservice Microservice
16. 16 © 2017 PENTASYS AG Unbekannt Ungewiss Unwahrscheinlich Photo by Jakub Kriz on Unsplash
17. 17 © 2017 PENTASYS AG ? ? Onlinefähigkeit Photo by Jakub Kriz on Unsplash
18. 18 © 2017 PENTASYS AG Großer Intellektueller Betrug (GIB) Photo by Jakub Kriz on Unsplash
19. 19 © 2017 PENTASYS AG Photo by Jakub Kriz on Unsplash Photo by Jakob Braun on Unsplash
20. 21 © 2017 PENTASYS AG Photo by Jakub Kriz on Unsplash Photo by Thomas Millot on Unsplash
21. 22 © 2017 PENTASYS AG Photo by Jakub Kriz on Unsplash
22. 23 © 2017 PENTASYS AG Photo by Jakub Kriz on Unsplash Photo by Joey Csunyo on Unsplash
23. 24 © 2017 PENTASYS AG Photo by Qurratul Ayin Sadia on Unsplash
24. 25 © 2017 PENTASYS AG 1. Er ist ein Ausreißer (außerhalb des Bereichs der Er- wartungen) Nach: „Der Schwarze Schwan“ – Nassim Nicholas Taleb Photo by Jakub Kriz on Unsplash 2. Hat enorme Auswirkungen 3. Erklärungen im Nachhinein
25. 26 © 2017 PENTASYS AG Logik des schwarzen Schwans: Das was wir nicht wissen, wird bedeutungsvoller Als das, was wir wissen. Nach: „Der Schwarze Schwan“ – Nassim Nicholas Taleb Schwarze Schwäne kommen unerwartet. Photo by Jakub Kriz on Unsplash Keine Vorhersage möglich.
26. 27 © 2017 PENTASYS AG Photo by Adam Frazier on Unsplash
27. 28 © 2017 PENTASYS AG Photo by Adam Frazier on Unsplash Projektbeispiel: Baubeschreibung + Einrichtungshandbücher Baubeschreibung (Office, CAD, PDF) Einrichtung (Lotus Notes, SAP) Enterprise-Web- Anwendung
28. 29 © 2017 PENTASYS AG Photo by Adam Frazier on Unsplash Projektbeispiel: Baubeschreibung + Einrichtungshandbücher 1:1-Abzug aus Lotus Notes (EXE) Komplexe, umfangreiche CAD-Zeichnungen Navigierbarkeit über Daten aus verschiedenen Versionen
29. 30 © 2017 PENTASYS AG Photo by Adam Frazier on Unsplash
30. 31 © 2017 PENTASYS AG Micro- service Micro- service UI Logik Datenbank Service-Ebene: • Maschinenlesbares API (z.B. Atom-Feeds) • Event-Sourcing Datenbank: • Redundante Speicherung • Replika Caching, Redundanz, Synchronisation Photo by Daniel Olah on Unsplash
31. 32 © 2017 PENTASYS AG Web-Storage (DOM Storage) Wird vollständig im Client gesteuert Key-Value-Paare (String) Lokale Speicherung: • Local Shared Objects (LSO) • Sind mit einer Domäne und dem lokalen Benutzerprofil des Zugriffsrechners verknüpft • Bleiben nach Beenden des Browsers bestehen • Firefox: Datenbankdatei (webappsstore.sqlite) Session Speicherung: • Sind mit dem Browser verknüpft • Daten werden beim Schließen des Browsers gelöscht Unterstützt somit mehrere Instanzen der Anwendung in verschiedenen Browserfenstern Photo by Daniel Olah on Unsplash
32. 33 © 2017 PENTASYS AG Indexed Database API Transaktionale Datenbank (IndexedDB, Objektdatenbank), in der Webseiten dauerhaft Daten speichern können Ergänzt den Web-Storage um: • Sortierung • Effiziente Suche durch Indizes • Speicherung mehrfacher Werte pro Key Arbeitet asynchron (Registrierung von Callback-Funktionen) Hält an der SOP fest PouchDB, GunDB, RxDB, Hood.ie, etc. Photo by Daniel Olah on Unsplash
33. 34 © 2017 PENTASYS AG Browser Session Storage Local Storage IndexedDB Chrome 10 MB 10 MB 6,6% des Gerätespeichers Firefox 10 MB 10 MB 10% des Gerätespeichers, < 2 GB Safari unlimitiert 5 MB unlimitiert Edge 10 MB 10 MB 4% des Gerätespeichers, < 2 GB Chrome Mobile 10 MB 10 MB 6,6 % des Gerätespeichers Safari Mobile unlimitiert 5 MB 50 MB / unlimitiert Photo by Daniel Olah on Unsplash
34. 35 © 2017 PENTASYS AG Web Worker Client-Anwendung (Main Thread) Web Worker (Thread) Nachrichten (messages) Photo by Daniel Olah on Unsplash
35. 36 © 2017 PENTASYS AG Service Worker Client-Anwendung (Main Thread) Service Worker (Thread) Nachrichten (messages) Cache Netzwerk Photo by Daniel Olah on Unsplash
36. 37 Progressive Web App (PWA) Nutzen eine Vielzahl an Technologien (u.a. Service Worker), um Web-Anwendungen „nativ“ erscheinen zu lassen Responsive Offlinefähig (Service Worker) App- (Anwendungs-) ähnlichkeit und Nutzererfahrung Photo by Daniel Olah on Unsplash
37. 38 Electron, Ionic, etc. Cross-Plattform Desktop-Anwendungen HTML, JavaScript, native Code Basieren auf Node.js Können auf sämtliche Aspekte des zugrunde liegenden Betriebssystems zugreifen. Photo by Daniel Olah on Unsplash
38. 39 Medizinischer Bereich Client- Anwendungen (Arztpraxis) Server Datenbank Patienten- Akten Photo by Daniel Olah on Unsplash
39. 40 JSON Web Token Standard zum sicheren Übermitteln verschlüsselter Informationen Header Payload Signatur xxxxxx.yyyyy.zzzzzz {"alg": "HS256", "typ": "JWT"} Photo by Daniel Olah on Unsplash
40. 41 OAuth 2 https : / / auth0 . com / docs / protocols / oauth2 Photo by Daniel Olah on Unsplash
41. 42 © 2017 PENTASYS AG Photo by Waldemar Brandt on Unsplash
42. 43 © 2017 PENTASYS AG Photo by Waldemar Brandt on Unsplash
43. 44 © 2017 PENTASYS AG Karl Popper Verlor seine Illusion, dass Wissenschaft etwas Besonderes sei indem er: sah, dass Freudianer + Marxisten ihre Theorien durch Beispiele stützten (Normalität) bemerkte, dass die Theorien niemals „falsch“ zu sein scheinen Wurden am Beispiel menschlichen Verhaltens bestätigt Photo by Waldemar Brandt on Unsplash
44. 45 © 2017 PENTASYS AG Karl Popper Schlussfolgerung: Wissenschaftliche Theorien schließen beobachtbare Tatbestände aus. Photo by Waldemar Brandt on Unsplash
45. 46 © 2017 PENTASYS AG Karl Popper Mittwochs regnet es nie. Alle Stoffe dehnen sich bei Hitze aus. Zwischen Client + Server gibt es immer eine bestehende Verbindung. Photo by Waldemar Brandt on Unsplash
46. 47 © 2017 PENTASYS AG Falsifikationismus Eine Hypothese muss, soll sie einen Beitrag zur Wissenschaft leisten, FALSIFIZIERBAR sein. Logische Möglichkeit zu zeigen, dass eine Hypothese nicht wahr ist. Photo by Waldemar Brandt on Unsplash
47. 48 © 2017 PENTASYS AG Falsifikationismus Entweder es regnet oder es regnet nicht. Photo by Waldemar Brandt on Unsplash
48. 49 © 2017 PENTASYS AG Falsifikationismus Der Mars bewegt sich auf einer elliptischen Bahn um die Sonne. Alle Planeten bewegen sich auf einer elliptischen Bahn um ihre jeweilige Sonne. Photo by Waldemar Brandt on Unsplash
49. 50 © 2017 PENTASYS AG Photo by Porapak Apichodilok from Pexels Meinungen und Anschauungen nicht nach ihrer Plausibilität einordnen. Nach dem Schaden, den sie anrichten können. MENSCH SEIN!