Open Source im professionellen Einsatz
Linux-Magazin 05/2008

Die Technik hinter Ajax

Dynamik im Browser

Bücher und Zeitschriften waren lange Vorbild bei der Gestaltung von Webseiten. Die Navigation glich dem Umblättern: Jeder Klick auf einen Link öffnete eine neue Seite. Viele aktuelle Webpräsenzen bieten jedoch dank Ajax eine Oberfläche, die sich beinahe wie eine Desktop-Anwendung verhält.

474

Seit Tim Berners-Lees ersten Webseiten haben sich die Standards für eine gelungene Präsentation im Internet stark gewandelt: Mehr und mehr orientieren sich Internerpräsenzen an Desktopanwendungen statt an Printprodukten. Hinter dem Schlagwort Ajax verbergen sich Features wie Pulldown-Menüs, sortierbare Tabellen oder interaktive Eingabeseiten. Die wesentliche Verbesserung im Vergleich zu statischen Seiten ist dabei, dass die für das Neuladen der Seiten typischen Wartezeiten entfallen.

Langer Weg

Bis eine Webseite vollständig im Browser zu sehen ist, durchlaufen Browser und Webserver mehrere Schritte, die sich zusammen zu einer für den Seitenbesucher oft unangenehmen Wartezeit summieren (Abbildung 1):

  • Der Browser sendet, ausgelöst durch einen Klick auf einen
    Link oder die Eingabe einer URL, eine Seitenanfrage an den
    Webserver.
  • Der Server bearbeitet die Anfrage und liefert HTML-Text und
    Grafiken aus. Bei hoher Last braucht er dazu oft einige Sekunden.
    Wie schnell die Inhalte ankommen, hängt von der
    Geschwindigkeit des Netzes ab. Die benötigte Zeit bleibt aber
    selbst in schnellen Intranets noch spürbar.
  • Schließlich liest der Browser die Antwort und zeigt die
    Seite an. Für jedes einzelne Bild startet die gleiche
    Schrittfolge noch einmal.

Zusammengenommen dauern diese drei Arbeitsschritte meist etliche Sekunden, bei hoher Serverlast eventuell Minuten. Bei HTML-Seiten ohne Ajax-Technologie laufen sie bei jeder noch so kleinen Änderung auf der Seite ab.

Im Vergleich zu Rich-Client-Anwendungen leidet der Komfort dabei arg. Verzögerungsfrei aufklappende Menüs, mit einem Mausklick neu sortierbare Tabellen, Tooltipps oder Drag&Drop sind auf der Basis der zähen Seiten-Reloads nicht praxistauglich umsetzbar. HTML-Seiten, die diese Features zur Verfügung stellen, sollten daher wie lokale Programme weitgehend autonom, also ohne Rückgriff auf eine Serververbindung arbeiten.

Abbildung 1: Pingpong-Spiel: Die Kommunikation zwischen Browser und Webserver, die bei Seiten ohne Ajax Voraussetzung für jede Veränderung der angezeigten Seite ist, setzt sich aus mehreren Kontakten zwischen Client (Browser) und Server zusammen und dauert in der Praxis meist etliche Sekunden.

Ohne Rückfrage

Um den Komfort zu verbessern, gehen mehr und mehr Webanwendungen dazu über, die Benutzereingaben direkt im Browser auf dem Computer des Seitenbesuchers zu verarbeiten. Von den verschiedenen Techniken, Anwenderdaten im Browser zu verarbeiten, haben sich nur zwei auf breiter Front durchgesetzt: Javascript und Flash. Beide stehen auf mehr als 90 Prozent aller Rechner zur Verfügung. Webentwickler können sie deshalb mit gutem Gewissen einsetzen. Andere Lösungen haben mit Ausnahme des auch noch verbreiteten Java-Plugins, nie ähnlich plattformübergreifende Verbreitung gefunden.

Vom Konzept her schlagen Flash und Javascript völlig unterschiedliche Wege ein. Das proprietäre Flash-Plugin führt binäre Flash-Applikationen im Browser aus. Das Plugin unterscheidet sich in seiner Einbindung in die Webseite nicht wesentlich von einer Bitmap-Grafik, bietet dem Benutzer jedoch eine interaktive Anwendung. Die grafischen Möglichkeiten des Flash-Plugins sind ausgezeichnet. Um sie zu nutzen, führt allerdings kaum ein Weg an den Adobe-Tools vorbei. Gleichwertige Open-Source-Alternativen sind nicht in Sicht.

Diesen Artikel als PDF kaufen

Express-Kauf als PDF

Umfang: 5 Heftseiten

Preis € 0,99
(inkl. 19% MwSt.)

Linux-Magazin kaufen

Einzelne Ausgabe
 
Abonnements
 
TABLET & SMARTPHONE APPS
Bald erhältlich
Get it on Google Play

Deutschland

Ähnliche Artikel

  • Ajax ohne X

    Wer Websites mit Ajax programmieren will, aber unter einer XML-Allergie leidet, muss nicht traurig sein. Die Javascript Object Notation (JSON) verpackt Daten so gut wie XML, aber mit weniger Ballast.

  • Projekteküche

    Ajax ist und bleibt ein aktuelles Thema. Die Programmiertechnik für interaktive Webanwendungen setzt voraus, dass sich Entwickler mit den unterschiedlich reagierenden Javascript-Engines der Browser auseinandersetzen - oder die Browser-Abstraktion einer der zahlreichen Ajax-Bibliotheken überlassen.

  • Koffer packen

    Wer im Kampf gegen statisches HTML nicht sofort den ganz großen Web-2.0-Wurf wagen will, macht erstmal kleine Schritte. Ein Vergleich versucht einen Koffer mit Hilfe dreier Javascript-Bibliotheken clientseitig zu sortieren. Findet alles seinen Platz?

  • Farbe für den Text

    Farbiger, formatierter Text in Webformularen: In Javascript programmierte Editoren, die auf den Design-Modus der Webbrowser aufsetzen, machen dies möglich. Diese Bitparade analysiert die Fähigkeiten von drei so genannten Rich-Text-Editoren.

  • Gut sortiert

    Große Datenmengen auf Webseiten übersichtlich anzuordnen ist eine Kunst. Am schnellsten gelänge es mit Javascript direkt im Client - wäre da nicht das spröde Document Object Model. Die Bibliothek Jquery erleichtert Entwicklern das Leben, indem sie die Skriptsprache aufpeppt und von Browsern abstrahiert.

comments powered by Disqus

Ausgabe 07/2017

Digitale Ausgabe: Preis € 6,40
(inkl. 19% MwSt.)

Artikelserien und interessante Workshops aus dem Magazin können Sie hier als Bundle erwerben.