Your SlideShare is downloading. ×
Wi
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
334
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Ajax Im Rahmen des Seminars „Multimedia“
  • 2. Agenda
    • Einordnung
    • Ajax-Grundlagen
    • Ajax-Technologien
    • Kritische Betrachtung
    • Frameworks
    • Zukunft
    Agenda
  • 3. Einordnung
    • Revolution des WWW im Rahmen des „Web 2.0“
    • Veränderung von Webanwendungen
      • Dynamische Benutzeroberfläche
      • Größerer Funktionsumfang
    •  Ajax ist zentrales Element des Web 2.0
    •  Ermöglicht neue Formen von Webanwendungen
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 4. Ajax-Architektur
    • Ajax = „Asynchronous JavaScript and XML“
    • Kombination bekannter Technologien in einer neuen Art
    • Erlaubt dynamische Interaktion mit Webanwendungen
      • Kein Neu-Laden der kompletten Webseite bei jeder Benutzeraktion
      • Asynchrones Nachladen von benötigten Daten
    • Rein clientseitiges Konzept
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 5. Ajax-Beispiele
    • Neue Features in bestehenden Anwendungen
    • Neue Arten von Anwendungen
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 6. Live-Demo
    • Beispielanwendung AjaxCalendar
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 7. Ajax-Applikationsmodell
    • Klassische Webanwendung
    HTTP-Request HTML + CSS In Anlehnung an: J. J. Garrett, Ajax – A New Approach To Web Applications, 2005, http://www.adaptivepath.com/ideas/essays/archives/000385.php HTTP-Request XML Ajax-Anwendung Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft Client (Browser) Benutzerinterface Server Webserver Datenbank, andere Server Client (Browser) Benutzerinterface Ajax-Engine Server Webserver Datenbank, andere Server
  • 8. Ajax-Technologien HTML HTML + CSS Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft  Trennung von Struktur und Layout  Dynamische Veränderung der Webseite zur Laufzeit JavaScript DOM XML XMLHttpRequest (X)HTML + CSS
  • 9. Ajax-Technologien
    • Plattformunabhängige Skriptsprache
    • In allen modernen Browsern implementiert
    • Ajax-Engine wird mit JavaScript implementiert
      • Verbindet alle Ajax-Technologien
      • Zugriff auf XMLHttpRequest und DOM
    JavaScript DOM XML XMLHttpRequest (X)HTML + CSS Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 10. Ajax-Technologien
    • Document Object Model - plattformunabhängige API
    • Umwandlung baumartig aufgebauter Dokumente in dynamische Baumstruktur
    • Unterstützt von allen modernen Browsern
    •  Nachträgliches Einfügen von Daten in Benutzeroberfläche
    (X)HTML + CSS JavaScript DOM XML XMLHttpRequest Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 11. Ajax-Technologien (X)HTML + CSS JavaScript DOM XML XMLHttpRequest DIV „Menu“ DIV „AktTermine“ DIV „Kalender“ DIV „NeuerTermin“ DIV DIV Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 12. Ajax-Technologien
    • Plattformneutraler Austausch von Daten
    • Strenge syntaktische Regeln
    •  Gute Maschinenlesbarkeit
    • Großer Overhead durch formatierende Tags
    •  Viele Ajax-Anwendungen nutzen XML zur Datenübertragung
    (X)HTML + CSS JavaScript DOM XML XMLHttpRequest <?xml version=„1.0“> <skiseminar> <seminarteilnehmer>23</seminarteilnehmer> </skiseminar> Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 13. Ajax-Technologien
    • Ermöglicht asynchrones Nachladen von Daten im Hintergrund
      • Open(DOMString method, DOMString url, boolean async)
      • Send(DOMString data)
    • Aufruf eines Event-Handlers bei Empfang von Daten
      • responseText : empfangene Daten
    • Automatisches Parsen von empfangenen XML-Daten
      • responseXML : DOM-Baum
    (X)HTML + CSS Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft JavaScript DOM XML XMLHttpRequest Function onreadystatechange() DOMString responseText Document responseXML Void open(…) Void send(…) XMLHttpRequest (vereinfacht)
  • 14. Beispielaufruf: „Neuer Termin“ Ajax-Anwendung Ajax-Engine (JavaScript) Function neuerTermin(…) XMLHttpRequest Webserver PHP-Skript (neuerTermin.php) Datenbank Function callback(…) DOM neuerTermin.php?datum= 05.01.2008&titel=Test5&... <?xml version=&quot;1.0&quot;> <termine> <termin> <titel>Test5</titel> <beschreibung>...</beschreibung> </termin> </termine> Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 15. Vorteile
    • Benutzerseitig
      • Kombination von Desktop- und Webanwendungen
      • Plattformunabhängigkeit
      • Schnellere Antwortzeiten
      • Höhere Interaktivität
    • Entwicklerseitig
      • Geringerer Ressourcenverbrauch
      • Einfachere Wartbarkeit
      • Vielfältigere Einsatzmöglichkeiten
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 16. Nachteile
    • Benutzerseitig
      • Zurück-Button und Verlauf funktionieren nicht
      • Keine native Unterstützung von Deep Links
      • Nutzererreichbarkeit
      • Internet-Abhängigkeit
    • Entwicklerseitig
      • Performanceprobleme
      • Browserunterschiede
      • Unterschiedliche Programmiersprachen
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 17. Ajax-Frameworks
    • Probleme der Ajax-Entwicklung
      • Browserspezifische Eigenheiten, unterschiedliche Schnittstellen
      • Viele verschiedene Komponenten  schwieriges Debuggen
    • Lösung
      • Einsatz von Ajax-Frameworks
    • Getestete und optimierte Funktionsbibliotheken
      • Abstraktion von Browserunterschieden
      • Vereinfachter Zugriff auf XMLHttpRequest
      • Zusätzliche Funktionen
    • Server- oder Clientbasiert
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 18. Ajax-Frameworks
    • Sajax
      • Serverbasiert  Automatisch generierter JavaScript-Code
      • Kein manueller Zugriff auf XMLHttpRequest nötig
      • Datenübertragung als Objekt möglich  Automatische Serialisierung
    • Prototype
      • Clientbasiert  Vereinfachte Schnittstellen zu XMLHttpRequest
      • Globale und abfragespezifische Eventhandler
      • Visuelle Komponenten und Effekte
    • Google Web Toolkit
      • Ajax-Entwicklung mit Java  Java-to-JavaScript Compiler
      • Kommunikation über Java-Klassen
      • Unterstützung von Zurück-Button und Verlauf
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 19. Zukünftige Entwicklung
    • Ajax ermöglicht neue Arten von Webanwendungen
      • Grenzen zwischen Web- und Desktopanwendungen verschwinden
    • Technologien bereits etabliert, dennoch Weiterentwicklung
    • Standardisierungsinitiativen
      • OpenAJAX Alliance
        • IBM, Oracle, Google, …
        • Entwicklung eines Open-Source Ajax-Frameworks
      • XForms (W3C Standard)
        • Erweiterte Web-Formulare
        • Neue erweiterte Oberflächenkomponenten
        • Als Teil von XHTML 2.0 geplant
    • Durch weitere Standardisierung wird Ajax-Entwicklung vereinfacht
    • Viele neue Ajax-Anwendungen erwartet
    Einordnung Grundlagen Technologien Bewertung Frameworks Zukunft
  • 20. Vielen Dank für die Aufmerksamkeit

×