AJAX und ASP.Net: Aufpolierte Web-Clients

AJAX bringt Web-Clients Desktop-Komfort. Auch für ASP.NET gibt es mittlerweile eine stattliche Zahl von AJAX-Lösungen.

Artikel erschienen in Swiss IT Magazine 2006/07

     

In Web-Entwicklerkreisen ist AJAX (Asynchronous Javascript And XML) derzeit in aller Munde. Der Grund: Mit AJAX lassen sich Web-Oberflächen dynamischer und funktionsreicher gestalten, ohne dass die gesamte Webseite jedes Mal aufs neue vom Webserver geladen werden muss. Hatten in den vergangenen Jahren die Rich Clients (auch Smart Client oder Rich Internet Client genannt) nicht zuletzt wegen dem Vormarsch der Service-orientierten Architekturen und den verbesserten Deployment-Verfahren gegenüber ihren statischen Web-Konkurrenten wieder Boden gutgemacht, bringt AJAX nun neuen Schwung in den Wettbewerb zwischen diesen beiden Client-Varianten.


Wie alles begann

Die Euphorie rund um AJAX fand ihren Ursprung in einem Dokument von Jesse James Garrett («Ajax: A New Approach to Web Applications», www.adaptivepath.com/publications/essays/archives/000385.php), welches im Februar 2005 publiziert wurde. Garrett zeigte auf, wie sich die Web-User-Experience mit der in den aktuellen Web-Browsern verfügbaren Technologien massiv verbessern lässt. Ein interessanter Aspekt dabei ist, dass diese Technologien –konkret sind dies JavaScript, CSS, DOM und XMLHttpRequest –bereits seit Jahren zur Verfügung standen und in vielen Web-Applikationen auch tatsächlich eingesetzt worden sind. Die von Garrett kreierte griffige Bezeichnung AJAX und der Hype um Web 2.0 haben nun das Interesse an den neuen Client-Techniken in breitem Masse geweckt und dafür gesorgt, dass kaum mehr ein Hersteller, der sich im Web-Anwendungsbereich bewegt, ohne Produkt- und Strategie-Ankündigungen im AJAX-Bereich dasteht.


AJAX in Action

Wer AJAX live in Aktion sehen möchte, wird im Web schnell fündig. Google setzt die neue Client-Technologie bereits bei einigen seiner Angebote ein. Dazu zählen etwa Google Maps, GMail oder Google Suggest. Gerade letzteres (www.google.com/webhp?complete=1&hl=en) eignet sich hervorragend, um einen ersten Eindruck davon zu erhalten, was AJAX zu leisten vermag. Google Suggest ist eine alternative Bedieneroberfläche des Google-Suchdienstes, die bereits während der Eingabe des Suchbegriffes mögliche Schlagwörter inklusive der Anzahl Treffer einblendet (siehe Bild). Eine weitere Site, welche AJAX anschaulich demonstriert, ist der Schweizer Kartendienst von Search.ch (map.search.ch). Auf einem Kartenausschnitt lassen sich Daten zu Geschäften, öffentlichen Einrichtungen oder Fahrpläne des öffentlichen Verkehrs in Form von Symbolen einblenden. Fährt man mit der Maus über ein entsprechendes Symbol, werden die entsprechenden Daten (z.B. ein Busfahrplan) ohne neues Nachladen der Karte in einem Pop-up-Fenster eingeblendet. Es gibt noch viele weitere Beispiele von AJAX-enabled Websites, die vor allem unter dem Markenzeichen Web 2.0 in den letzten Monaten für Furore gesorgt haben. Dazu zählen die Web-Textverarbeitung Writely (www.writely.com) ebenso wie die Collaboration-Lösung Zimbra (www.zimbra.com) oder Microsofts kommendes Service-Portal Windows Live (www.live.com).


Wie funktioniert AJAX?

Die Kernidee von AJAX ist es, eine neue Ebene für die Kommunikation zwischen Client und Server zu schaffen, auf der Daten –normalerweise in Form von XML –asynchron übertragen werden können. Die asynchrone Kommunikation hat den Vorteil, dass das Web-User-Interface nicht warten muss, bis die Übertragung abgeschlossen ist. Konkret läuft die Kommunikation zwischen Client und Server folgendermassen ab: Der Web-Client enthält JavaScript-Code, über den sich ein HTTP-Request an einen Webserver absetzen lässt. Dieser verarbeitet die Anfrage und schickt dem Client die angeforderten Daten zurück. Dort startet ein weiteres JavaScript, das die Serverantwort verarbeitet und die erhaltenen Daten an einer bestimmten Stelle im HTML-Code einfügt (siehe auch Diagramm «So funktioniert AJAX»). Der grosse Vorteil dabei ist, dass für die Aktualisierung von Seiteninhalten kein Reload der ganzen Website notwendig ist. Dem Benutzer wird so das Gefühl vermittelt, mit einer Rich-Client-Anwendung (Desktop-Anwendung) zu arbeiten. Zudem bleibt beim Nachladen der Daten der aktuelle Zustand auf der Gesamtseite erhalten (beispielsweise die Position des Cursors oder der Inhalt von Elementen). Auch die generelle Interaktion mit einer Webseite lässt sich mit AJAX verbessern. So lassen sich on-the-fly Statusmeldungen einblenden, Validierungen von Feldeingaben durchführen oder Seitenelemente per Drag&Drop umplazieren.
Schliesslich können mit AJAX-Anwendungen auch Real-Time-Updates ohne Zutun des Benutzers verarbeitet werden. Ein News-Service könnte etwa neue Schlagzeilen in eine geöffnete Webseite einspeisen, ohne wie bisher auf ein intervallweises Nachladen der Webseite angewiesen zu sein.






So funktioniert AJAX


AJAX und ASP.Net

AJAX-Anwendungen von Hand zu programmieren ist eine aufwendige Angelegenheit. Aus diesem Grund tauchen immer mehr Frameworks, Scriptsammlungen und Komponenten, die dem Web-Entwickler einen grossen Teil dieser Arbeit abnehmen. Viele der verfügbaren Bibliotheken werden auf Open-Source-Basis entwickelt und dürfen lizenzkostenfrei eingesetzt werden. Auch für ASP.Net gibt es bereits eine ganze Reihe solcher Frameworks. Die Webseite AJAXpatterns (http://ajaxpatterns.org/DotNet_Ajax_Frameworks) listet momentan 11 verschiedene AJAX-Bibliotheken für ASP.Net auf. Die meisten dieser Lösungen vereinfachen das Ausrüsten von ASP.Net-Anwendungen mit AJAX-Features erheblich, verlangen vom Web-Entwickler aber nach wie vor fortgeschrittene JavaScript-Kenntnisse. Allerdings gibt es auch immer mehr Frameworks, welche die Implementation von AJAX ohne Programmierung (einen Vergleich findet man unter www.daniel-zeiss.de/AJAXComparison/Results.htm) ermöglichen.
Mittlerweile haben auch die kommerziellen Anbieter von ASP.Net-Komponenten wie etwa Infragistics (www.infragistics.com
), Telerik (www.telerik.com) oder ComponentArt (www.componentart.com) ihre Chancen erkannt und damit angefangen, ihre ASP.Net-Controls in AJAX-fähigen Varianten anzubieten. Dazu zählen etwa Controls für Datagrids (tabellarisches Anzeigen von Datensätzen) oder Treeviews, die via AJAX in der Lage sind, Daten vom Server nachzuladen und anzuzeigen. Über ein AJAX-fähiges Datagrid wird der User so beispielsweise in der Lage sein, sich durch Hunderte von Datensätzen durchzublättern, ohne dass die Webseite ein einziges Mal nachgeladen werden muss.


Das Atlas-Projekt

Es war klar, dass auch Microsoft auf den AJAX-Trend reagieren würde, und so war denn die Ankündigung des Atlas-Projekts keine allzu grosse Überraschung. Mit Atlas will der Softwaremulti ASP.Net 2.0 noch in diesem Jahr mit AJAX-Funktionalität in Form eines Add-on nachrüsten. Hinter Atlas verbirgt sich ein komplettes Framework mit verschiedenen Client- und Serverkomponenten, welche die Komplexität reduzieren sollen, die das Schreiben von AJAX-Anwendungen von Natur aus mit sich bringt. Ziel ist es, dass Web-Entwickler AJAX-Features in ihre Web-Lösungen einbauen können, ohne Experten auf den Gebieten von JavaScript, DOM oder XMLHTTP zu sein.


• Client-Komponenten: Ein Hauptbestandteil von Atlas ist die Client Script Library. Dabei handelt es sich um ein erweiterbares JavaScript-Framework. Um das Framework näher an .Net-Entwickler heranbringen zu können, hat das ASP.Net-Team die Client-Bibliotheken um ein objektorientiertes Programmiermodell erweitert und Eigenschaften wie Typensystem, Datentypen, Namensräume oder Ereignisse eingebaut. Ganz nach dem Vorbild von ASP.Net wird man Atlas-Funktionalität zudem auch mit einer deklarativen Markup-Sprache definieren können. Zudem wird Microsofts AJAX-Lösung über einen Browser Compatibility Layer verfügen, der sich selbsttätig darum kümmert, dass die Web-Anwendung mit unterschiedlichen Browsern funktioniert. Die Bibliotheken enthalten vorbereitete AJAX-Funktionen wie z.B. Drag&Drop, Pop-up-Fenster oder Tooltips, die sich mit wenig Aufwand in bestehenden HTML-Elementen nutzen lassen.


• Server-Komponenten: Neben den Client-Scripts verfügt Atlas auch über Server-Komponenten. Dazu zählen AJAX-fähige Web-Server-Controls, welche die normalen ASP
.Net-Server-Controls (Button, Labels, Options, Textboxen, Hyperlinks, Validierung etc.) widerspiegeln. Sie erlauben AJAX-Anwendungen zu erstellen, ohne dass selber JavaScript-Routinen für den Client geschrieben werden müssen. Diese werden von den Atlas-Controls zur Laufzeit automatisch generiert. Neben den AJAX-fähigen Abbildern der Standard-Controls wird es auch einige neue Atlas-Komponenten wie das HoverBehavior-, Pop-up- oder AutocompleteBehavior-Control geben. Ebenfalls zum Serverteil zählen Web Services, welche ASP.Net-Funktionen für Personalisierung, User-Profile oder Authentifizierung via HTTP und SOAP zugänglich machen und sich dadurch aus einem AJAX-Client einfacher nutzen lassen.
Derzeit befindet sich Atlas noch im Betastadium und ist in einer Preview-Version via atlas.asp.nety verfügbar. Die endgültige Fassung soll im Laufe dieses Jahres auf den Markt kommen. Erst in künftigen Versionen von .Net –vermutlich in Visual Studio 2007 (Codename «Orcas») –wird Atlas zum festen Bestandteil.




Artikel kommentieren
Kommentare werden vor der Freischaltung durch die Redaktion geprüft.

Anti-Spam-Frage: Wieviele Zwerge traf Schneewittchen im Wald?
GOLD SPONSOREN
SPONSOREN & PARTNER