Ajax, Comet & Co.
Roman Roelofsen
Managing Director (aka Alpha Geek)
Weigle Wilczek GmbH
Twitter: romanroe

W-JAX, 8. Nove...
Architekturen
Mainframe
Die gesamte Logik l¨uft auf dem Server
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Clients dienen lediglic...
Mainframe
Die gesamte Logik l¨uft auf dem Server
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Clients dienen lediglic...
Mainframe
Die gesamte Logik l¨uft auf dem Server
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Clients dienen lediglic...
2-tier
Die gesamte Logik l¨uft auf dem Client
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Server dient lediglich zur...
2-tier
Die gesamte Logik l¨uft auf dem Client
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Server dient lediglich zur...
2-tier
Die gesamte Logik l¨uft auf dem Client
a
Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ...
a

Server dient lediglich zur...
3-tier (mit Rich-Client)
Fachlogik verteilt auf Server & Client
Ablauflogik verteilt auf Server & Client
UI-Logik im Client...
3-tier (mit Rich-Client)
Fachlogik verteilt auf Server & Client
Ablauflogik verteilt auf Server & Client
UI-Logik im Client...
3-tier (mit Rich-Client)
Fachlogik verteilt auf Server & Client
Ablauflogik verteilt auf Server & Client
UI-Logik im Client...
3-tier (mit Web-Client)
Fachlogik gr¨ßtenteils auf dem Server
o
Ablauflogik gr¨ßtenteils auf dem Server
o
UI-Logik im Clien...
3-tier (mit Web-Client)
Fachlogik gr¨ßtenteils auf dem Server
o
Ablauflogik gr¨ßtenteils auf dem Server
o
UI-Logik im Clien...
3-tier (mit Web-Client)
Fachlogik gr¨ßtenteils auf dem Server
o
Ablauflogik gr¨ßtenteils auf dem Server
o
UI-Logik im Clien...
Web-Anwendungen Web 1.0

Wie eine 3-tier-Architektur ...
die nur aus HTML-Seiten request/response besteht

Die gesamte Log...
Web-Anwendungen Web 2.0

Wie eine 3-tier-Architektur ...
... die das HTML-Seiten request/response Modell f¨rs
u
Provisioni...
Technologien
AJAX

Hat angefangen als ”pimp my web page”
Input-Validierung
Mehr Interaktivit¨t f¨r UI Dialoge
a u

Mittlerweile prim¨re...
REST

Hat angefangen als besseres SOAP
Server-Entit¨ten werden als Resourcen betrachtet
a
Zugriff erfolgt uber HTTP Operati...
REST

Hat angefangen als besseres SOAP
Server-Entit¨ten werden als Resourcen betrachtet
a
Zugriff erfolgt uber HTTP Operati...
Comet

Wie kann der Server dem Client Informationen mitteilen?
a.k.a. Server-push
Der Begriff Comet fasst verschiedenen Tec...
Architekturen + Technologien
Architekturen + Technologien
Architekturen + Technologien im Web 3.0
Code
Plain Ajax
Apache Wicket
Direct Web Remoting
Atmosphere
Lift Web
Leon
WebSockets

Ajax und Comet ”missbrauchen” HTTP um eine
RCP/REST-Kommunikation abzubilden
Ajax: Jeder Aufruf startet einen ...
Comet & WebSockets aus Server-Sicht

Beim Comet & WebSockets startet der Browser eine
Verbindung zum Server und h¨lt diese...
Wir stellen ein!

Wir suchen f¨hige Java/Scala/JavaScript/Clojure/RCP/...
a
Entwickler
Wir bieten eine gesunde Mischung au...
Vielen Dank f¨r Ihre Aufmerksamkeit!
u
Fragen?
Nächste SlideShare
Wird geladen in …5
×

Ajax, Comet & Co.

4.377 Aufrufe

Veröffentlicht am

Ajax, Comet & Co.

Veröffentlicht in: Technologie
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
4.377
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
5
Aktionen
Geteilt
0
Downloads
2
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Ajax, Comet & Co.

  1. 1. Ajax, Comet & Co. Roman Roelofsen Managing Director (aka Alpha Geek) Weigle Wilczek GmbH Twitter: romanroe W-JAX, 8. November 2011
  2. 2. Architekturen
  3. 3. Mainframe Die gesamte Logik l¨uft auf dem Server a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Clients dienen lediglich zur Darstellung und zur Eingabe Tastatur + Monitor
  4. 4. Mainframe Die gesamte Logik l¨uft auf dem Server a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Clients dienen lediglich zur Darstellung und zur Eingabe Tastatur + Monitor Vorteile Wenig Schichten & wenig Systemgrenzen Single source Nur ein Kontrollfluss Klassische Input/Output-Architektur Sicher, da relativ geschlossen
  5. 5. Mainframe Die gesamte Logik l¨uft auf dem Server a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Clients dienen lediglich zur Darstellung und zur Eingabe Tastatur + Monitor Vorteile Wenig Schichten & wenig Systemgrenzen Single source Nur ein Kontrollfluss Klassische Input/Output-Architektur Sicher, da relativ geschlossen Nachteile Sehr einfache UI Eventuell langsam Mehr Datentransfer
  6. 6. 2-tier Die gesamte Logik l¨uft auf dem Client a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Server dient lediglich zur Persistenz, ohne fachliches Wissen Datenbankmanagementsystem Ausnahme: Stored procedures, ... Kommunikation zwischen Server & Client l¨uft uber eine a ¨ technische Schnittstelle "select * from foo"
  7. 7. 2-tier Die gesamte Logik l¨uft auf dem Client a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Server dient lediglich zur Persistenz, ohne fachliches Wissen Datenbankmanagementsystem Ausnahme: Stored procedures, ... Kommunikation zwischen Server & Client l¨uft uber eine a ¨ technische Schnittstelle "select * from foo" Vorteile Komplexe UIs sind m¨glich o Wenig Schichten & klar definierte Systemgrenzen Schnelle UI Nur ein Kontrollfluss Fast single source
  8. 8. 2-tier Die gesamte Logik l¨uft auf dem Client a Gesch¨ftsregeln, Ablaufregeln, UI-Logik, ... a Server dient lediglich zur Persistenz, ohne fachliches Wissen Datenbankmanagementsystem Ausnahme: Stored procedures, ... Kommunikation zwischen Server & Client l¨uft uber eine a ¨ technische Schnittstelle "select * from foo" Vorteile Komplexe UIs sind m¨glich o Wenig Schichten & klar definierte Systemgrenzen Schnelle UI Nur ein Kontrollfluss Fast single source Nachteile Client-Deployment n¨tig o Nicht sicher
  9. 9. 3-tier (mit Rich-Client) Fachlogik verteilt auf Server & Client Ablauflogik verteilt auf Server & Client UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber eine a ¨ fachliche Schnittstelle personWebService.loadPerson(3)
  10. 10. 3-tier (mit Rich-Client) Fachlogik verteilt auf Server & Client Ablauflogik verteilt auf Server & Client UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber eine a ¨ fachliche Schnittstelle personWebService.loadPerson(3) Vorteile Komplexe UIs sind m¨glich o Klar definierte Systemgrenzen Schnelle UI Client ist unabh¨ngig von z.B. der Persistenztechnologie a
  11. 11. 3-tier (mit Rich-Client) Fachlogik verteilt auf Server & Client Ablauflogik verteilt auf Server & Client UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber eine a ¨ fachliche Schnittstelle personWebService.loadPerson(3) Vorteile Komplexe UIs sind m¨glich o Klar definierte Systemgrenzen Schnelle UI Client ist unabh¨ngig von z.B. der Persistenztechnologie a Nachteile Erheblich mehr Technologievielfalt
  12. 12. 3-tier (mit Web-Client) Fachlogik gr¨ßtenteils auf dem Server o Ablauflogik gr¨ßtenteils auf dem Server o UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber ... a ¨ a) ... HTML-Seiten request/response b) ... eine fachliche Schnittstelle personWebService.loadPerson(3)
  13. 13. 3-tier (mit Web-Client) Fachlogik gr¨ßtenteils auf dem Server o Ablauflogik gr¨ßtenteils auf dem Server o UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber ... a ¨ a) ... HTML-Seiten request/response b) ... eine fachliche Schnittstelle personWebService.loadPerson(3) Vorteile Komplexe UIs sind m¨glich o Klar definierte Systemgrenzen Schnelle UI Client ist unabh¨ngig von z.B. der Persistenztechnologie a
  14. 14. 3-tier (mit Web-Client) Fachlogik gr¨ßtenteils auf dem Server o Ablauflogik gr¨ßtenteils auf dem Server o UI-Logik im Client Persistenzlogik im Server Kommunikation zwischen Server & Client l¨uft uber ... a ¨ a) ... HTML-Seiten request/response b) ... eine fachliche Schnittstelle personWebService.loadPerson(3) Vorteile Komplexe UIs sind m¨glich o Klar definierte Systemgrenzen Schnelle UI Client ist unabh¨ngig von z.B. der Persistenztechnologie a Nachteile Erheblich mehr Technologievielfalt
  15. 15. Web-Anwendungen Web 1.0 Wie eine 3-tier-Architektur ... die nur aus HTML-Seiten request/response besteht Die gesamte Logik liegt im Server Clients dienen lediglich zur Darstellung und zur Eingabe
  16. 16. Web-Anwendungen Web 2.0 Wie eine 3-tier-Architektur ... ... die das HTML-Seiten request/response Modell f¨rs u Provisioning nutzt ... die zur prim¨re Kommunikation fachliche Schnittstellen a nutzt personWebService.loadPerson(3) Fachlogik verteilt auf Server & Client Ablauflogik verteilt auf Server & Client
  17. 17. Technologien
  18. 18. AJAX Hat angefangen als ”pimp my web page” Input-Validierung Mehr Interaktivit¨t f¨r UI Dialoge a u Mittlerweile prim¨res Kommunikationskonzept um fachlichen a Daten vom Server zum Browser zu ubertragen ¨ Erm¨glicht durch ... o JavaScript im Browser XMLHttpRequest XML → JSON JSON.parse(...) JSON.stringify(...)
  19. 19. REST Hat angefangen als besseres SOAP Server-Entit¨ten werden als Resourcen betrachtet a Zugriff erfolgt uber HTTP Operationen ¨ GET, POST, DELETE, ... IDs werden uber die URL kodiert ¨ http://server/resource/1 Wichtigster Unterschied zu SOAP/Corba/etc: Fachliche Entit¨t 1:1 REST Resource a Feste Anzahl Operationen
  20. 20. REST Hat angefangen als besseres SOAP Server-Entit¨ten werden als Resourcen betrachtet a Zugriff erfolgt uber HTTP Operationen ¨ GET, POST, DELETE, ... IDs werden uber die URL kodiert ¨ http://server/resource/1 Wichtigster Unterschied zu SOAP/Corba/etc: Fachliche Entit¨t 1:1 REST Resource a Feste Anzahl Operationen → SQL
  21. 21. Comet Wie kann der Server dem Client Informationen mitteilen? a.k.a. Server-push Der Begriff Comet fasst verschiedenen Techniken zusammen, um Server-push zu erm¨glichen o Streaming iFrame XmlHttpRequest Long Polling XmlHttpRequest Script tag Eigentlich alles ”Hacks”, das Ergebnis ist aber i.d.R. ausreichend
  22. 22. Architekturen + Technologien
  23. 23. Architekturen + Technologien
  24. 24. Architekturen + Technologien im Web 3.0
  25. 25. Code
  26. 26. Plain Ajax
  27. 27. Apache Wicket
  28. 28. Direct Web Remoting
  29. 29. Atmosphere
  30. 30. Lift Web
  31. 31. Leon
  32. 32. WebSockets Ajax und Comet ”missbrauchen” HTTP um eine RCP/REST-Kommunikation abzubilden Ajax: Jeder Aufruf startet einen neuen HTTP request inkl. Header Comet: Server weiß nicht, dass der Request zur Comet-Kommunikation dient WebSockets definieren ein Protokoll (zwischen Server und Browser) um sich von HTTP zu entfernen HTTP Request → TCP/IP Socket WebSocket kann bi-direktional genutzt werden
  33. 33. Comet & WebSockets aus Server-Sicht Beim Comet & WebSockets startet der Browser eine Verbindung zum Server und h¨lt diese offen a Problem f¨r Servlet Container u Jeder HTTP Request wird auf einen Thread gemappt Wenn der HTTP Request offen bleibt, gibt es entweder zuviele Threads oder neue Anfragen werden nicht beantwortet L¨sung o Servlets 3.0 Nativer Support im Web-Container (z.B. Jetty)
  34. 34. Wir stellen ein! Wir suchen f¨hige Java/Scala/JavaScript/Clojure/RCP/... a Entwickler Wir bieten eine gesunde Mischung aus Programmierer Berater Kicker-Profi Bitte bei mir melden! roelofsen@weiglewilczek.com
  35. 35. Vielen Dank f¨r Ihre Aufmerksamkeit! u Fragen?

×