Ix 12 2011_reicher_werden_kaintantzis

  • Published on
    22-Oct-2014

  • View
    1.244

  • Download
    0

Embed Size (px)

DESCRIPTION

Der Begriff Rich Internet Application kurz RIA ist zwar gngig, aber nicht konkret definiert. Wer eine RIA entwickeln will, sollte genau wissen, was sie von Thin und Rich Clients unterscheidet. Und vor allem: welche neuen Funktionen HTML5 fr diese Aufgabe mitbringt.

Transcript

<p>ix.1211.086-091</p> <p>Rich Internet Applications (RIAs) sol-len vor allem eins gewhrleisten: ei-ne den Desktop-Clients vergleichbarekomfortable Bedienbarkeit im Browser.Google hat mit gut aussehenden undleicht zu bedienenden Anwendungenvorgemacht, wie RIAs sich prsentierenknnen. Die neue Richness im Inter-net ist allgegenwrtig. Moderne Web-Clients fr E-Mail, Wegbeschreibungenoder Suchfunktionen fr Adressen ha-ben aber bei den Anwendern auch neueErwartungen bezglich Interaktivittund Leistungsfhigkeit geweckt, die sievon Desktop-Applikationen her kennen eine Herausforderung fr die Ent-wickler neuer Applikationen. Daherlohnt es sich, die Konzepte und die Po-sitionierung von RIAs, Thin und RichClients zu beleuchten und im Kontextvon HTML5 eine aktuelle Auslegeord-nung vorzunehmen. Wer will, kann andieser Stelle in einem kleinen Quiz er-</p> <p>mitteln, was er selbst unter einer RIAversteht (siehe Quiz-Kasten).</p> <p>Im Fokus erfolgreicher Applikationenstehen der Benutzer und seine Aufga-ben. Nur wenn man sich auf dessen In-teraktionsverhalten konzentriert, kannman seine Erwartungen erfllen odersogar bertreffen. Dabei knnen An-forderungen an die Benutzerinterak -tion so unterschiedlich formuliert seinwie Stndige Datenerfassung und In-teraktion und Daten lesen.</p> <p>Im ersten Fall ist das Eingeben vonDaten eine der Hauptaufgaben des Anwenders, beispielsweise bei einerSchadenserfassungssoftware von Ver-sicherungsmitarbeitern oder bei Ent-wicklungsumgebungen. Die Applikationsoll schnell sein und kurze Antwortzei-ten gewhrleisten. Hilfreich dabei sinddie Navigation mit der Tastatur und dasVerwenden von Tastenkrzeln fr hu-fige Aufgaben. In diesem Fall unter-</p> <p>sttzt eine lokal installierte Applikationden Benutzer am besten.</p> <p>Im zweiten Fall will der Benutzerschnell informiert werden. Er selbstgibt Informationen wenn berhaupt nur in Form lngeren, unformatiertenTextes in ein einziges Feld respektivewenige Felder ein. Das sind typischer-weise Webapplikationen wie Nachrich-tenportale, Blogs und Foren.</p> <p>Neben der Konzentration auf die Be-nutzer gibt es betriebliche Aspekte undProjektrahmenbedingungen, die rele-vant sind. Dazu gehren Anforderungenwie das Umgehen mit unterschiedli-chen Versionen einer Applikation oderdass Applikationen auf jedem Firmen-PC vorhanden respektive von jedemFirmen-PC aus erreichbar sein mssen.</p> <p>Ein hufig verlangter Aspekt ist Off -line-Fhigkeit. Beispielsweise soll einAuendienstmitarbeiter beim Kundenvor Ort eine Offerte ohne Netzverbin-dung erstellen. Wenn er zurckkommtund der Laptop am Netz ist, soll die Ap-plikation beginnen, Daten zu synchroni-sieren. Ein anderes Beispiel: Benutzersollen E-Mails offline schreiben knnen,die automatisch abgeschickt werden,wenn das Netz wieder verfgbar ist.</p> <p>Will man schnell viele Personen er-reichen, dient dazu hufig eine Appli-kation, die man nicht installieren muss.Der Anwender soll nicht warten ms-sen, bis die Applikation benutzbar ist.So soll er etwa die News einer Zeitungschnell lesen knnen, ohne zuvor einPlug-in zu installieren oder ein Pro-gramm zu aktualisieren. Keine Installa-tion bedeutet zudem, dass man keineInfrastruktur fr ein effizientes undschnelles Rollout bentigt und so dieVertriebsinfrastruktur einsparen kann.</p> <p>In diesem Umfeld von Forderungen,Rahmenbedingungen und Benutzer -ansprchen ist es wichtig, die unter-schiedlichen Client-Kategorien Thin,RIA und Rich auseinanderzuhalten.Nur so kann man die richtige Katego-rie und schlielich die richtige Technikfr eine Aufgabe whlen.</p> <p>RIA ist nicht gleich RIADas RIA-Konzept befindet sich imSpektrum zwischen klassischen seiten-basierten Webseiten (Thin Clients) und Stand-alone-Applikationen (RichClients) (siehe Abbildung1). Zu Erste-ren gehren etwa die Internetseiten vonZeitungen, whrend man zu den Stand-alone-Applikationen Pakete wie MSOffice, Photoshop oder Entwicklungs-</p> <p>86 iX 12/2011</p> <p>REPORT Web-Clients</p> <p>Wie HTML5 Rich Internet Applications verndert</p> <p>Reicher werden Nikolaos Kaintantzis</p> <p>Der Begriff Rich Internet Application kurz RIA ist zwar gngig, aber nicht konkret definiert. Wer eine RIA entwickelnwill, sollte genau wissen, was sie von Thin und Rich Clients unterscheidet. Und vor allem: welche neuen Funktionen HTML5 fr diese Aufgabe mitbringt.</p> <p>ix.1211.086-091 07.11.2011 17:49 Uhr Seite 86</p> <p> Copyright by Heise Zeitschriften Verlag</p> <p>werkzeuge wie Eclipse rechnet. Austechnischer Sicht lassen sich RIAs indrei Kategorien einteilen:RIA mit Ajax, also auf Basis von Ja-va Script wie map.search.ch oder Goo-gle Mail, RIA mit Plug-in, zum Beispiel derRoutenplaner Map24.com, der auf Java-Applets basiert, oder Photoshop Light/Express (Flash-Client), RIA ohne Browser kann man tech-nisch als Spezialfall von RIA mit Plug-in verstehen. Der Anwender schaut sichdie Applikation im Browser mit einemPlug-in an, und wenn sie ihm gefllt,kann er sie auf den Desktop ziehenoder herunterladen. Beispiele hierfrsind Java Web Start und Adobe AIR.</p> <p>HTML5 gehrt technisch zu RIAmit Ajax. Im Wesentlichen erweitertund vereinfacht es die bisherige Versionder Hypertext Markup Language. Hinzukommen viele neue JavaScript-Schnitt-stellen sowie Neuerungen in CSS3.</p> <p>So weit die technische Sicht. Die An-wendersicht verdeutlicht Abbildung2.Je nher eine Client-Kategorie in denBereich Stand-alone vordringt, destomehr Vorarbeit muss der Anwenderleisten, bis er eine konkrete Applika tionbenutzen kann. Gegebenenfalls ist ernicht in der Lage, diese Vorarbeiten aus-zufhren, etwa weil er JavaScript ausGrnden der Firmen-Policy gar nichtaktivieren kann oder keine Administra-torrechte fr die Installation einer Ap-plikation auf seinem Rechner hat.</p> <p> !</p> <p>Fr den Anwender ist wichtig, was erinstallieren muss (Abb.2).</p> <p>iX 12/2011 87</p> <p>x-TRACT Webapplikationen gibt es in diversen Ausprgungen von der einfachen Webseite </p> <p>bis zur Rich Internet Application , die sich fr unterschiedliche Aufgaben eignen. Wichtige Kriterien bei der Wahl der richtigen Client-Technik sind unter anderem </p> <p>der Grad der Benutzerinteraktion und die durch die Projektrahmenbedingungen bestimmte Ausfhrungsumgebung.</p> <p> Whrend sich bisher einige Funktionen nur durch zustzliche Bibliotheken oder Plug-ins realisieren lieen, knnen Entwickler sie jetzt nativ in Browsern nutzen, die HTML5 untersttzen.</p> <p>Quiz: Was ist eine RIA?Der Begriff RIA ist allgegenwrtig, dochselten verstehen zwei Personen dasselbedarunter. Zwei Fragen sollen ermitteln,welches Verstndnis ein Leser an dieserStelle des Artikels von RIA hat (bitte diePunkte in Klammern addieren).Frage1:RIAs vereinfachen die Verteilungder Applikation, weil der Anwender (au-er dem Browser) nichts installieren muss,um mit ihr zu arbeiten.</p> <p>(1) Stimme ich voll zu. (2) Stimme ich nicht zu.Frage2:RIAs bieten dieselben Mglich-keiten und denselben Bedienkomfort wielokal installierte Applikationen.(10) Stimme ich voll zu. (20) Stimme ich nicht zu.Die Auswertung des Quiz erfolgt am Endedes Artikels.</p> <p>"#$#%&amp;'(%&amp;%&amp;$%$</p> <p> !</p> <p>Aus Sicht der Informatik gibt es unterschiedliche RIA-Typen (Abb.1).</p> <p>)!*</p> <p>#</p> <p>+,+</p> <p>+</p> <p> (</p> <p>Der Grad der Benutzerinteraktion in einer Applikation reicht von einfachbis komplex (Abb.3).</p> <p>ix.1211.086-091 07.11.2011 17:49 Uhr Seite 87</p> <p> Copyright by Heise Zeitschriften Verlag</p> <p>Bei der Entscheidungsfindung, wel-che Client-Kategorie ein Entwicklernutzen will, spielt auch der geforderteGrad an Interaktion mit dem User-In-terface eine wichtige Rolle. Hinsicht-lich der Dimension der Benutzerinter-aktion unterscheidet man zwischeneiner einfachen Navigation ber Bild-schirmseiten sowie interaktiven undkomplexen Vorgngen. Um die Art derBenutzerinteraktion im Spektrum ein-</p> <p>fach bis komplex/hoch (siehe Ab -bildung3) einordnen zu knnen, sollteman verschiedene Fragen stellen: SindDialoge erforderlich, die beispielsweiseeinen Kunden einem Produkt zuordnen?Gehrt das schnelle Arbeiten ber Tas-tatur-Navigation zu den Anforderungen?Bentigt der Anwender Drag&amp;Drop,um zum Beispiel einen Datensatz ausder Datenbank von einer Applikationzur anderen zu schieben? Jede mit Jabeantwortete Frage erhht die Reich-haltigkeit der Interaktion und verlangtden Einsatz einer untersttzenden Tech-nik. Nicht alle Client-Kategorien un-tersttzen die Interaktion gleicherma-en. Abbildung4 verdeutlicht dies imKontext der Benutzerinteraktion undder Ausfhrungsumgebung.</p> <p>Der Anwender hat seine eigene SichtGem Abbildung4 untersttzen so-wohl Rich Clients als auch RIAs einhohes Ma an Interaktion mit der Be-nutzerschnittstelle. Die Unterschiedewerden deutlich, wenn man die Schich-ten einer Applikation betrachtet (sieheAbbildung 5).</p> <p>Ein Rich Client deckt alle Schichtenvon der Datenhaltung bis zur Oberfl-chendarstellung ab. Der Server, falls ergebraucht wird, ist in der Regel nur frdie gemeinsame Datenhaltung zustn-dig eventuell auch fr einen Teil derGeschftslogik. Microsofts Word istein Bespiel fr einen Rich Client, derkeinen Server bentigt. Outlook hinge-gen ist ein Rich Client mit Server, derfr die Aufbewahrung der Mails zu-stndig ist.</p> <p>Deckt ein Client mehrere Schichtenab, kann die Kommunikation zwischenihm und dem Server in tieferen Schich-ten und weniger hufig erfolgen. Solchein Client hat ein schnelleres Antwort-verhalten, bietet somit eine bessere Be-nutzeruntersttzung und erlaubt so einflssigeres Arbeiten.</p> <p>Im RIA-(Ajax)-Fall ohne HTML5kann der Client maximal die Schich-ten bis zur Geschftslogik abdecken.Gleichzeitig muss immer ein Servervorhanden sein. Er kann Aufgaben biszur Prsentationslogik bernehmen.Die daraus resultierende lngere Ant-wortzeit beeintrchtigt unter Umstn-den die Interaktivitt. KomplexereUser-Interfaces reagieren meistens ei-nen Tick zu langsam, sodass ein fls-siges Arbeiten nicht immer mglichist. Einen ganzen Tag intensiv mit ei-</p> <p>nem Ajax-Client zu arbeiten, ist oftanstrengend.</p> <p>Mit HTML5 lassen sich ebenfallsAjax-Applikationen realisieren. Abbil-dung5 zeigt, dass ein damit realisierterClient standardisiert in tiefere Schich-ten vordringen kann, ermglicht unteranderem durch Local Storage, IndexedDatabase und File-API. Ein RIA-Ajax-Client kann mit HTML5 seine Datenselbst verwalten und bentigt hierfrkeinen Server. Das fhrt wie beim RichClient zu schnellen Reaktionszeiten.Muss der HTML5-Client aber mit demServer interagieren, weil er von dortDaten oder Logik bezieht, kann sichdas wie bei Ajax ohne HTML5 negativauf die Interaktivitt auswirken.</p> <p>Abbildung4 zeigt oben rechts undunten links freie Flchen, die nicht vonClient-Kategorien abgedeckt sind. FrRIAs mit Ajax gibt es technische Gren-zen, die noch nicht berwindbar sind.Dazu gehren unter anderem:Drag&amp;Drop zwischen Applika -tionen: Diese Funktion steht fr Textund Bilder zwar zur Verfgung, aller-dings haben nicht die Applikationen dieKontrolle darber. Technisch gar nichtmachbar ist zurzeit das Verschiebenvon Business- oder Domain-Objektenzwischen Programmen (zum Beispieldas Kunden-Objekt von der Applika -tionA in die Stammdatenhaltung).Reaktionszeiten: Komplexere, inter-aktive Applikationen mit vielen Objek-ten knnen zu schlechten Reaktionszei-ten der Benutzerschnittstelle fhren.Automatische Hardware-Interak-tionen: Nicht mglich ist beispielswei-se das automatische Inspizieren des In-halts eines Memory-Sticks oder einer-Karte beim Anschluss.</p> <p>Grenzen von Technik und AufwandSomit bieten Ajax-Clients einen gerin-geren Grad an Interaktionsmglichkei-ten als Rich Clients. Dies symbo lisiertdas Dreieck rechts oben in Abbildung6.Die gestrichelte Line darunter symbo-lisiert die Kosten-Nutzen-Grenze. DasEntwickeln nah an dieser Grenze wirdschnell teuer, weil Standards verlassenwerden und Unterschiede in Browsernoder Plattformen nicht mehr durchsFramework gekapselt sind. Dies gilt esfrhzeitig zu erkennen und durch dieWahl einer passenderen Client-Kate-gorie zu vermeiden, in die Pareto-Falle zu tappen. Diese 80/20-Regelbesagt, dass 80Prozent der Arbeit in nur</p> <p>88 iX 12/2011</p> <p>REPORT Web-Clients</p> <p> (</p> <p>!</p> <p>!"</p> <p>#</p> <p>$%</p> <p>Clients lassen sich in unterschiedlichetechnische Kategorien einteilen(Abb.4).</p> <p>&amp;</p> <p>-!*</p> <p>*</p> <p>.*</p> <p>+ '</p> <p>$%</p> <p>-!*</p> <p>*</p> <p>.*</p> <p>+</p> <p>'</p> <p>()</p> <p>*+&amp;</p> <p>&amp;</p> <p>Ein RIA-Client mit Ajax konnte vorHTML5 nicht alle Schichten einer Web-anwendung abdecken (Abb.5).</p> <p> (</p> <p>!</p> <p>!"</p> <p>#</p> <p>/0</p> <p>$%</p> <p>()*+</p> <p>Sowohl der Technik als auch dem Auf-wand sind bei RIAs Grenzen gesetzt(Abb.6).</p> <p>ix.1211.086-091 07.11.2011 17:49 Uhr Seite 88</p> <p> Copyright by Heise Zeitschriften Verlag</p> <p>20Prozent der Gesamtzeit erledigt wer-den, die verbleibenden 20Prozent alsodie meiste Arbeit verursachen.</p> <p>HTML5 hat dazu beigetragen, dieAjax-Box zu vergrern und somit dieGrenzen zu verschieben, unter anderemmit einer JavaScript-API fr nativesDrag&amp;Drop. So kann man etwa Datei-en aus dem Dateisystem in eine Web-applikation hineinziehen. Auch dasDrag&amp;Drop selbst definierter Typenist mglich. Nichtsdestotrotz bleibt so-wohl die technische als auch die Kos-ten-Nutzen-Grenze bestehen.</p> <p>Auch bei wenig interaktiven Stand-alone-Clients stellt sich die Kosten-Nut-zen-Frage. Im Bereich unten links (Ab-bildung6) ist es oft effektiver, sich freinen Web-Client zu entscheiden. </p> <p>Die Entwicklung mobiler Applikatio-nen (Apps) ist ein Geschftsfeld, in demRich Clients fr wenig interaktive Ar-beitsweisen erstellt werden. Die Opti-mierung von Webseiten fr jedes Handykann sich als ebenso umfangreich er-weisen wie eine Applikation nativ frdie Plattform beispielsweise iPhoneoder Android zu schreiben. Fr dienative Stand-alone-Vari ante spricht zu-dem, dass die im Trend liegendenApp-Stores respektive Market-Placeses erleichtern, Applikationen zu fin-den. Der Benutzer wei, dass eine Ap-plikation aus dem Store zum Telefonpasst. Bei einer Webseite kann er nichtdavon ausgehen, dass sie fr sein Tele-fon optimiert wurde.</p> <p>Wer jetzt sein eigenes Verstndnis,was eine RIA ausmacht, mit dem ver-gleichen mchte, das er am Anfang die-ses Artikels hatte, findet die Antwort inder Auswertung.</p> <p>Konkrete Vernderungendurch HTML5Die Abbildungen5 und6 haben ge-zeigt, dass HTML5 neue Mglichkei-ten erffnet. Obwohl die Spezifikationnoch nicht fertig ist, untersttzen mo-derne Browser Teile davon bereits jetzt.Jede neue Browser-Generation bietetmehr Support fr das aktuelle HTML5.</p> <p>Einige Funktionen, die HTML5 insRampenlicht rckt, lieen sich bereitsfrher mit JavaScript-Bibliotheken rea-lisieren. Jedoch musste der Entwicklerfr jedes Feature eine gesonderte Li-brary verwenden. Diese Bibliothekenfunktionierten jedoch oft nur mit ein-zelnen Browsern in bestimmten Ver-sionen. Der Vorteil von HTML5 alsStandard ist, dass die neuen Browser</p> <p>wettbewerbsbedingt frh und mglichstviel seiner Funktionen untersttzen.</p> <p>Konkret haben Neuerungen rund umHTML5 eine Annherung von Ajax anStand-alone-Clients gebracht, alsodie RIA(Ajax)-Box aus Abbildung6nach unten vergrert. Dazu zhlenOffline-Mglichkeiten:Durch denApplication Cache in HTML5 kann derAutor einer Webseite respektive Appli-kation bestimmen, welche Teile auchoffline verfgbar sein sollen. Diesewerden auf dem Gert gespeichert unddann verwend...</p>