HERBSTCAMPUS 2010 - Comparison and Categorization of Java Web Frameworks (JSF, Wicket, Tapestry,...

Kategorisierung von Web-Frameworks im Java-Umfeld

Gobelingewebe

Kai WähnerMaibornWolff et al GmbH

www.mwea.de

Unüberschaubare Auswahl im Alltag

16.09.2010 Seite 2Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Unüberschaubare Auswahl bei Web-Frameworks

16.09.2010 Seite 3Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Viele gute Artikel in Fachzeitschriften

16.09.2010 Seite 4Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Flame War – unerwünscht, aber überall existent

16.09.2010 Seite 5Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 5

www.mwea.de

Keine Auflistung von Features einzelner Frameworks

16.09.2010 Seite 6Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Bullet Point Boot Camp

www.mwea.de

Keine Quellcode-Beispiele

16.09.2010 Seite 7Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Was ist die "Key-Message"?

16.09.2010 Seite 8Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Ermöglichen eine Entscheidung zu treffen

16.09.2010 Seite 9Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Kategorisierung wird benötigt

16.09.2010 Seite 10Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

AC

YZ 1

667IV

XX„Englisch“

„Deutsch“

„Japanisch“

NUMMERNBUCHSTABEN SPRACHEN

www.mwea.de

Ziele dieses Vortrags

16.09.2010 Seite 11Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

AC

YZ 1

667IV

XX„Englisch“

„Deutsch“

„Japanisch“

NUMMERNBUCHSTABEN SPRACHEN

Wichtige Begriffe verstehen!

www.mwea.de

Ziele dieses Vortrags

16.09.2010 Seite 12Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

AC

YZ 1

667IV

XX„Englisch“

„Deutsch“

„Japanisch“

NUMMERNBUCHSTABEN SPRACHEN

Wichtige Begriffe verstehen!

Web-Frameworks kagegorisieren!

www.mwea.de

Ziele dieses Vortrags

16.09.2010 Seite 13Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

AC

YZ 1

667IV

XX„Englisch“

„Deutsch“

„Japanisch“

NUMMERNBUCHSTABEN SPRACHEN

Wichtige Begriffe verstehen!

Web-Frameworks kagegorisieren!

Entscheidung treffen können!

www.mwea.de 16.09.2010 Seite 14Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

1. Wichtige Begriffe

2. Kategorisierung

3. Einsatzmöglichkeiten

Agenda

www.mwea.de 16.09.2010 Seite 15Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

1. Wichtige Begriffe(bezüglich Webentwicklung)

2. Kategorisierung

3. Einsatzmöglichkeiten

Agenda

www.mwea.de

Das wichtigste Modewort: Web 2.0

16.09.2010 Seite 16Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Web 2.0 – technisch betrachtet: AJAX

16.09.2010 Seite 17Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Was ist AJAX nicht?

16.09.2010 Seite 18Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Was ist AJAX nicht?

16.09.2010 Seite 19Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Definition von AJAX

16.09.2010 Seite 20Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

AJAX is a group of interrelated

web development techniques used

on the client-side to create

interactive web applications.

(Wikipedia)

www.mwea.de

Klassische Kommunikation vs. AJAX

16.09.2010 Seite 21Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Klassische Kommunikation vs. AJAX

16.09.2010 Seite 22Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Client-Anfrage

+

Server-Antwort

www.mwea.de

Klassische Kommunikation vs. AJAX

16.09.2010 Seite 23Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

XMLHttpRequest-

Objekt

HTML

JSON / XML

JavaScript

DOM

www.mwea.de 16.09.2010 Seite 24Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Multi-Page vs. Single-Page

Waren-katalogWaren-katalog

WarenkorbWarenkorb

StartseiteStartseite

Kunden-verwaltungKunden-verwaltung

Suche Artikel

Wähle Artikel aus

Bestelle Artikel

www.mwea.de 16.09.2010 Seite 25Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Multi-Page vs. Single-Page

Web-anwendun

g

Schreibe Email

Zeige Eingang an

Suche Email XYZ

www.mwea.de

Server-zentrisch vs. Client-zentrisch

9/16/2010 Seite 26Einsatz und Grenzen von Java Server Faces 2.0 (Kai Wähner)

ServerServerClientClient

Request

Response: GUI + Daten

Bei jedem Request:

www.mwea.de

Server-zentrisch vs. Client-zentrisch

9/16/2010 Seite 27Einsatz und Grenzen von Java Server Faces 2.0 (Kai Wähner)

ServerServerClientClient

Request

Response: Vollständige GUI

+ Daten

Beim ersten Request:

www.mwea.de

Server-zentrisch vs. Client-zentrisch

9/16/2010 Seite 28Einsatz und Grenzen von Java Server Faces 2.0 (Kai Wähner)

ServerServerClientClient

Request

Response: Vollständige GUI +

Daten

Beim ersten Request:

ServerServerClientClient

Request

Response: GUI + zugehörige Steuerungslogik

Bei weiteren Requests:

www.mwea.de

Action-basiert vs. Komponenten-basiert

9/16/2010 Seite 29Einsatz und Grenzen von Java Server Faces 2.0 (Kai Wähner)

ServerServerClientClient

Request

Response

www.mwea.de

Action-basiert vs. Komponenten-basiert

9/16/2010 Seite 30Einsatz und Grenzen von Java Server Faces 2.0 (Kai Wähner)

ServerServerClientClient

Request

Response

ButtonButton

Custom ComponentCustom Component

Dropdown-Box

Dropdown-Box

TableTable

www.mwea.de

Mehrkanal-Fähigkeit

16.09.2010 Seite 31Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Webanwendung

www.mwea.de

Offline-Fähigkeit

16.09.2010 Seite 32Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de 16.09.2010 Seite 33Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

1. Wichtige Begriffe

2. Kategorisierung

3. Einsatzmöglichkeiten

Agenda

(von Web-Frameworks)

www.mwea.de

Welche Kriterien zur Bewertung von Web-Frameworks?

16.09.2010 Seite 34Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Mögliche Kriterien zur Bewertung von Web-Frameworks

16.09.2010 Seite 35Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 35

InternationalsierungLesezeichen

„Post-Redirect-Problem“

AJAX

Einige weitere...

www.mwea.de

Die Kriterien sind bereits durchgängig erfüllt

16.09.2010 Seite 36Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

InternationalisierungLesezeichen

„Post-Redirect-Problem“

AJAX

Einige weitere...

www.mwea.de

Kategorisierung von Web-Frameworks

16.09.2010 Seite 37Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Zeit-

aufwandKurz Lang

CRUD

Klassische Web-

Anwendung

Rich Internet Application

(RIA)Rich Client

Portal

www.mwea.de

Klassische Webanwendung

16.09.2010 Seite 38Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Klassische Webanwendung

16.09.2010 Seite 39Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Klassische Webanwendung

16.09.2010 Seite 40Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Klassische Webanwendung

16.09.2010 Seite 41Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Technisch betrachtet:

� Kein Plugin notwendig

� Browser-Kompatibilitätsprobleme (besonders bei AJAX)

www.mwea.de

;Mögliche Web-Frameworks

16.09.2010 Seite 42Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 42

Klassische Webanwendung

www.mwea.de

Rich Internet Application (RIA)

16.09.2010 Seite 43Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Rich Internet Application (RIA)

16.09.2010 Seite 44Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Technisch betrachtet:

� GUI wird bei Start auf Client geladen

� Plugin notwendig

www.mwea.de

Mögliche Web-Frameworks

16.09.2010 Seite 45Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Rich Internet Application (RIA)

www.mwea.de

Rich Client

16.09.2010 Seite 46Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Rich Client

16.09.2010 Seite 47Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Technisch betrachtet:

� GUI wird bei Start auf Client geladen

� Kein Plugin notwendig

� Keine Browser-Kompatibilitätsprobleme

www.mwea.de

Mögliche Web-Frameworks

16.09.2010 Seite 48Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 4816.09.2010 | Seite 48

Rich Client

www.mwea.de

CRUD Client (Create – Read – Update – Delete)

16.09.2010 Seite 49Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

CRUD Client (Create – Read – Update – Delete)

16.09.2010 Seite 50Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Technisch betrachtet:

� Für Client kein Unterschied zur klassischen Webanwendung

� „Full Stack“-Framework

� Ziel: Effizientere Entwicklung

www.mwea.de

Mögliche Web-Frameworks

16.09.2010 Seite 51Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

CRUD Client

(Roma Framework)

www.mwea.de

Portal

16.09.2010 Seite 52Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Portal

16.09.2010 Seite 53Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Technisch betrachtet:

� Portlet-Standard

� Action-Phase und Render-Phase

� „Low-Level“-Programmierung

www.mwea.de

Mögliche Web-Frameworks

16.09.2010 Seite 54Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 54

Portal

www.mwea.de

Überblick über Web-Frameworks

16.09.2010 Seite 55Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Grails

JSF

Flex

JavaFX

Tapestry

Wicket

Roma Framework

ZK Framework

GWT

Struts

Spring MVC

Komplexität hoch

Komplexität gering

Klassische

Web-

anwendungRIA

Lift

www.mwea.de

Überblick über Web-Frameworks

16.09.2010 Seite 56Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Grails

JSF

Flex

JavaFX

Tapestry

Wicket

Roma Framework

ZK Framework

GWT

Struts

Spring MVC

Komplexität hoch

Komplexität gering

Klassische

Web-

anwendungRIA

Lift

CRUD

www.mwea.de

Überblick über Web-Frameworks

16.09.2010 Seite 57Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Grails

JSF

Flex

JavaFX

Tapestry

Wicket

Roma Framework

ZK Framework

GWT

Struts

Spring MVC

Komplexität hoch

Komplexität gering

Klassische

Web-

anwendungRIA

Lift

Klassische Webanwendung

www.mwea.de

Überblick über Web-Frameworks

16.09.2010 Seite 58Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Grails

JSF

Flex

JavaFX

Tapestry

Wicket

Roma Framework

ZK Framework

GWT

Struts

Spring MVC

Komplexität hoch

Komplexität gering

Klassische

Web-

anwendungRIA

Lift

Rich Client

www.mwea.de

Überblick über Web-Frameworks

16.09.2010 Seite 59Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Grails

JSF

Flex

JavaFX

Tapestry

Wicket

Roma Framework

ZK Framework

GWT

Struts

Spring MVC

Komplexität hoch

Komplexität gering

Klassische

Web-

anwendungRIA

Lift

RIA

www.mwea.de 16.09.2010 Seite 60Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

1. Wichtige Begriffe

2. Kategorisierung

3. Einsatzmöglichkeiten

Agenda

(Einige Szenarien aus dem Unternehmensalltag)

www.mwea.de

Beispiel 1

16.09.2010 Seite 61Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Interne Anwendung zur Verwaltung von Daten

Geringe Kosten

GUI muss ihren „Job“

tun

Kein Aufwand für tolles Design

Nur „Must-Haves“

www.mwea.de

Beispiel 1

16.09.2010 Seite 62Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Internal Application for managing Data

Geringe Kosten

GUI muss ihren „Job“ machen

Kein Aufwand für tolles Design

Nur „Must-Haves“

CRUD

www.mwea.de

Beispiel 2

16.09.2010 Seite 63Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Einstellungstest für Bewerber

Optisch nicht anspruchsvoll

Muss kurze Netzwerk-Probleme überstehen

Gute Benutzbarkeit

Hohe Verfügbarkeit

www.mwea.de

Beispiel 2

16.09.2010 Seite 64Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Einstellungstest für Bewerber

Optisch nicht anspruchsvoll

Muss kurze Netzwerkprobleme

überstehen

Gute Benutzbarkeit

Hohe Verfügbarkeit

Rich Client

www.mwea.de

Beispiel 2

16.09.2010 Seite 65Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Unterhaltungssoftwarefür Marketingzwecke

Tolle OptikProfessionelles

Design

Gute Benutzbarkeit

Multimedia-Integration

www.mwea.de

Beispiel 3

16.09.2010 Seite 66Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Unterhaltungssoftwarefür Marketingzwecke

Tolle OptikProfessionelles

Design

Gute Benutzbarkeit

Multimedia-Integration

RIA

www.mwea.de

Beispiel 4

16.09.2010 Seite 67Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

ExterneUnternehmensdarstellung

Übersichtliche Struktur

Hohe Verfügbarkeit

Gute Benutzbarkeit

Schneller Zugriff

www.mwea.de

Beispiel 4

16.09.2010 Seite 68Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

ExterneUnternehmensdarstellung

Übersichtliche Struktur

Hohe Verfügbarkeit

Gute Benutzbarkeit

Schneller Zugriff

KlassischeWebanwendung

www.mwea.de

Beispiel 5

16.09.2010 Seite 69Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 69

Große Unternehmensanwendung

Integration mehrere Geschäftsbereiche in

eine Oberfläche

Mehrkanalfähige Prozesse

Offline-fähigkeit

Corporate Identity

www.mwea.de

Beispiel 5

16.09.2010 Seite 70Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

16.09.2010 | Seite 70

GroßeUnternehmensanwendung

Integration mehrere Geschäftsbereiche in eine

Oberfläche

Mehrkanalfähige Prozesse

Offline-fähigkeit

Corporate Identity

Portal

www.mwea.de 16.09.2010 Seite 71Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Trend oder Hype?

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 72Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 73Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 74Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

IDE-Plugins Community

Komponenten-Bibliotheken

GUI-Builder

Fachbücher

Medienberichte (Konferenzen,

Blogs, Magazine)

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 75Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 75

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 76Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 77Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 77

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 78Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Trend oder Hype?

16.09.2010 Seite 79Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Ist die "Key-Message" angekommen?

16.09.2010 Seite 80Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

www.mwea.de

Was war das Ziel dieses Vortrags?

16.09.2010 Seite 81Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen16.09.2010 | Seite 81

www.mwea.de

Ziel erreicht?

16.09.2010 Seite 82Bitte unter Einfügen/Foliennummer den Präsentationsnamen einpflegen

Time to

DevelopeShort Long

CRUD

Klassische Web-

Anwendung

Rich Internet Application

(RIA)

Rich Client

Portal

OfflineAJAX Multi-

Page

Und so weiter...

JSFGWT

JavaFXViele mehr...

Vielen Dank!

Kai WähnerMaibornWolff et al GmbH

kai.waehner@mwea.de

www.kai-waehner.de/blog