Ajax-Erfahrungsbericht - die Web2.0-Wunderwaffe
Ich arbeite nun schon seit längerer Zeit mit Ajax und möchte hier mal einen Erfahrungsbericht dazu abgeben.
Ajax im Einsatz
Für mich war es anfangs schwer zu verstehen was Ajax einem Webdesigner bringen soll. Da das Web bislang synchron war, gab es auch nur wenige Anwendungsfälle in denen ein asynchroner Aufruf Sinn machen würde. Durch die steigende Zahl an Webanwendungen, die Ajax unterstützten, wurde es mir mit der Zeit immer deutlicher und man findet tatsächlich in seinen eigenen Webanwendungen immer wieder eine Lücke, die den Einsatz von Ajax rechtfertigt und die Qualität der Website erhöht.
Mit dem Ajax-Feuerwerk was die Webanwendung Netvibes bietet kann ich zwar bislang noch nicht mithalten, aber auf folgendes konnte ich schon meine eigenen Hände legen:
- nach dem Ausfüllen eines Eingabefeldes wird eine Datenbankabfrage getätigt und geprüft ob dieser oder ähnliche Einträge schon vorhanden sind
- nach dem Klick auf einen Link zu einem Thema werden Links, die diesem Thema zugeordnet sind, aus der Datenbank geladen
- gibt ein User einen Link ein und verläßt dann das Eingabefeld wird mittels Ajax die eingegebene Url aufgerufen, der “title” der Website herausgefiltert und zurückgegeben
- auswerten eines Textes während der Eingabe (Anzahl der Wörter, prozentualer Anteil der Keywords im Text)
- Serverseitge Formularvalidierung (prüft ob eingegebener Username schon in der Datenbank vorhanden ist)
Mit Sortierbaren Listen habe ich mich bislang noch beschäftigt, da fehlt einfach noch der praktische Nutzen. Was ich auch festgestellt habe: man kann mit recht wenig Erfahrung mit Ajax sehr viel erreichen, da die meisten Probleme einfach mit ein paar Zeilen Code zu lösen sind und dieser Code kann in leicht abgewandelter Form immer wieder eingesetzt werden.
Neben der erhöhten “Geschwindigkeit”, die man durch ein Ausbleiben des Seitenreloads erhält, konnte ich zudem noch feststellen wie ressourcenschonend der Einsatz von Ajax sein kann. Das läßt sich besser an einem Beispiel zeigen: Lurki. Dies ist die Kategorie “Webdesign” der Webanwendung Lurki und dort werden die letzten Themen dieser Kategorie aufgelistet. Nun hat der User einerseits die Möglichkeit jedes Thema einzelnd aufzurufen und sich die Links anzeigen zu lassen, oder aber er klickt auf das “Pluszeichen” neben dem Titel um die Links zu einem Thema zu erhalten. Und hier kommt nun das ressourcen-schonende Ajax zum Einsatz: Man kann natürlich beim laden der Seite neben den Themen direkt auch alle assoziierten Links mitladen, das würde aber erstens länger dauern (aufgrund des umfangreicheren Query an die Datenbank) und zweitens mehr Serverlast/Ressourcen fressen. Mittels Ajax ist es nun möglich das wir erst die Abfrage nach den Links für ein Thema starten, sobald sich der User entschieden hat. Jedes “Plus”-Symbol ist mit einem Javascript-”onclick”-Event unterlegt das beim Klick des Users die ID des Themas über Ajax an ein Php-Script schickt und in diesem wird die Datenbankabfrage ausgeführt, das Ergebnis zurückgeschickt und der User erhält alle Links ohne das die Seiten neugeladen werden musste.
Ajax-Frameworks - Enorme Arbeitserleichterung
Man muss ja nicht alles von neuem erfinden, wozu gibt es gute, ausgereifte und kostenlose Frameworks die einem die gesamte Arbeit erleichtern? Ich lege euch hier besonders Prototype und für tolle Effekte noch scriptaculous ans Herz, nie war es einfacher Ajax in seinen eigenen Webanwendungen zu verwenden. Ein kleines Tutorial zu scriptaculous von mir findet ihr hier: Scriptaculous - 5 Minuten Speed Tutorial.
Durch die ganzen Frameworks und Erleichterungen darf man aber eines nicht vergessen: man sollte Ajax dort einsetzen wo es auch Sinn macht und nicht zum verrecken überall!
Ajax macht Spass
Nicht nur für den User ist es eine Bereicherung wenn die Seite schnelles Feedback vermittelt, es macht einfach Freude seine eigenen funktionierenden Ajax-Effekte zu coden. Dies ist natürlich schwer an jemanden zu vermitteln der noch nie was mit Ajax gemacht hat, aber probierts aus und ihr werdet verstehen was ich meine.
Ajax Ausblick
Ajax läßt ja jetzt schon ganz schön die Muskeln spielen, aber es wird sicher noch mehr kommen. Ich denke das heimische Software für den PC immer weiter von Webanwendungen abgelöst wird, man bedenke nur solche Dinge wie “Dateiformate umwandeln” oder “Desktop-Systeme“. Dies wird alles noch durch weitere Dienste unterstützt die neben Ajax auch ein Teil der Web2.0 Bewegung darstellen, so zum Beispiel kostenloser online speicherplatz. Aber Web2.0 ist hier ja garnicht so das Thema, Ajax wird weiter um sich greifen und das surfverhalten der User verändern. Am Ende des Web1.0 war es so das Besucher Websites gemieden haben die nur langsam geladen haben, am Ende von Web2.0 wird es so sein das man Webseiten meidet die nicht auf Ajax basieren und die für noch so jeden kleinen Request einen Seitenreload machen.
Probleme die ich sehe
Ajax einzusetzen wird immer leichter, Ajax professionell einzusetzen hingegen immer schwieriger. So sehe ich zum Beispiel Traffic-/Ressourcen-Probleme in Anwendungen in denen das Ergebnis einer Anfrage nicht in Sessions gespeichert wird. Wenn ein Klick auf einen Link eine DB-Abfrage ausführt und jemand dieses System ausnutzt und dauernd auf den Link klickt, werden binnen weniger Minuten mehrere tausend Abfragen an die Datenbank ausgeführt. Natürlich kann hier ein Datenbank-Cache greifen, aber mit einem zwischenspeichern des Ergebnisses in einer Session sollte dem auch schon entgegengewirkt sein.
Feedback ist ein weiterer Punkt, der User muss wissen das im Hintergrund etwas geschieht. Eigentlich leicht umsetzen, einfach eine Gif-Ladegrafik anzeigen solange das Ergebnis noch nicht vorhanden ist.
Da Suchmaschinen kein Javascript ausführen bleiben zwangsläufig manche Inhalte verborgen die auch nicht indexiert werden können. Entweder bedenkt man dies am Anfang während der Struktur-Planung der Website und macht die Inhalte noch an anderer Stelle verfügbar so daß sie von Suchmaschinen indexiert werden können, oder man verzichtet auf die indexierung durch die Suchmaschinen.
Ajax - Und trotzdem ändert sich nichts
Was ist Ajax eigentlich? Oder besser: Welche Vorteile habe ich durch Ajax? Doch eigentlich nicht mehr als das ich einen Request an den Server ausführen kann ohne das die gesamte Website neugeladen werden muss. Heißt das dann im Umkehrschluss nicht das ich alles auch ohne Ajax programmieren kann? Genau so ist es! Aber das Ajax doch Sinn macht und man eben nicht alles ohne Ajax sinnvoll umsetzen kann zeigt das Beispiel von Google Suggest. Natürlich ließe sich das ganze auch ohne Ajax realisieren, allerdings müsste man dann bei jedem Zeichen was eingegeben werden würde einen Reload der Seite erzwingen um den Request an den Server zu schicken, so macht das natürlich keinen Sinn, zeigt aber gut an welchen Stellen Ajax Sinn macht und sogar essentiell ist.
Setzt Ajax nicht zum verrecken ein, zögert aber andererseits nicht die Web 2.0 Wunderwaffe an Stellen einzusetzen wo es Sinn macht.
Verwandte Artikel
- AJAX und Suma-dolle-Links
- AJAX Ladezeiten Feedback zur Erhöhung der Usability
- AJAX - die 5 TOP Einsatzgebiete
- AJAX ultra short - keine Ausreden mehr
- Ajax -Einführung
5 Kommentare
Tut mir leid, die Kommentarfunktion für diesen Beitrag ist geschlossen.
“auswerten eines Textes während der Eingabe (Anzahl der Wörter, prozentualer Anteil der Keywords im Text)”
Mich würde ja mal interessieren wozu du da AJAX brauchst O.o
Ich finde AJAX ist nicht wirklich so super wie oft angepriesen wird. Jetzt mal ganz davon abgesehen das der Kreis wo AJAX wirklich Sinn macht relativ beschränkt ist - AJAX ist einfach ein Monster Traffic Fresser. Man wird sich denken das die 1-2 KB mehr am Tag nicht die Welt machen, aber gerade bei Anwendungen wie Chats usw. die ständig neu geladen werden (User online Anzeige …) kann das sehr schnell den Server lahmlegen und nicht nur wegen Traffic sondern auch wegen zuvielen PHP Anfragen auf einmal.
Zum testen wo Ajax Sinn macht und wo nicht ;)
Natürlich sollte man vorher überlegen ob man lieber auf asynchronität verzichtet um Traffic und Ressourcen zu sparen oder den Traffic verkraftet um der Webanwendung eine nötige Asynchronität zu verschaffen.
Gerade bei kleinen Aktualisierungen, wie das Löschen eines Datensatzes oder das automatische Zwischenspeichern eines Textes (wie es Wordpress 2.0 auch macht) denke ich das Ajax den User bei seiner Arbeit mit dem System unterstützt.
Das Beispiel mit dem Chat: Natürlich kommen da häufig Aktualisierungen vor, aber im Grunde hängt alles von der Implementierung ab und welche Maßnahmen man ergreift um den Server zu schonen (bzw den Traffic)
Ajax=Monster Traffic Fresser?
mit ajax requests kann man den overhead der html dateien extremst dezimieren indem man auf json o.ä. setzt.
chat systeme sind immer schon traffic fresser gewesen, wurst in welches sprache die implementiert werden - das liegt aber einfach in der natur der app, dass sie ständig reloaded werden muss. und da kann ajax auch keine wunder wirken!
ich setzte ajax requests nur für aktionen der applikation ein, aber nicht um content zu generieren bzw dynamisch zu laden. mit diesem prinzip bin ich bis jetzt gut gefahren.
Ajax ist doch kein Traffic Fresser, im Gegenteil! Richtig eingesetzt kann es sehr wohl Traffic sparen, und zwar mächtig. Korrekt ist, dass der Server mehr Requests gleichzeitig verarbeiten muss. Ist immer abhängig von der Applikation…
Zu den Frameworks kann ich Christian nur Recht geben:
Prototype und Scriptaculous sind wunderbar :-)
Vielleicht auch eine Erwähnung Wert:
Lightbox 2.0
http://www.huddletogether.com/projects/lightbox2/
Alle drei Pakete setze ich erfolgreich in unserem Online Shop um.
Danke Christian für deinen kompetenten Post!
Ich finde, der Ajax Hype ist zu einseitig.
Es wird immer wieder damit argumentiert, dass nur geänderte Inhalte übermittelt werden, um somit Traffic zu sparen.
Dass auf traditionelle Weise der Browser schon geladene Elemente aus dem Cache holt, wird wohl vergessen.
Die Nachteile das clientseitig Javascript aktiviert werden muss und die mangelnde Barrierefreiheit spricht echt gegen Ajax.
Für mich lohnt sich der Aufwand nicht.