Ajax:From Desktop Applications towards Ajax Web Applications

From Desktop Applications towards Ajax Web Applications

Agenda

Communication

The insight of Ajax Web Applications.

Features of Ajax

Conclusion

A brief History and Introduction of Ajax

Defining Ajax &Technologies incorporated

✓

6

5

4

3

2

1

1990’s-Webpages were completely Static. 1995 – First version of JAVA with Applets. 1996 – Microsoft introduced iFrame element to HTML. 1999 – Dynamic Update of News stories and Stock

quotes on msn.com 1999 – Creation of XMLHttpActivex control and

XMLHttpRequest Object. 2002 – OddPost

History

2004 – Gmail 2005 – Google Maps 2005 – Jesse James Garrett’s article:”AJAX – A New

Approach to Web applications”. 2006 – W3C released first draft for XHR object.

History (contd..)

Defining Ajax

Ajax is not A technology A new Programming Language A Platform.

Defining Ajax

Ajax is A technique that uses set of open standard

technologies with support by cross-browser and cross-platform compatibility.

It incorporates several technologies, each flourishing in its own right, coming together in powerful new ways.

These technologies work together in different levels each with specific functionality.

Ajax incorporates• The Hypertext Transfer Markup Languages: HTML,

XHTML, XML.

• Language to describe the presentation of a document:

Cascading Style Sheets (CSS).• Interaction and dynamic display: W3C Document Object

Model.• Client-side language and parse data: JavaScript.• Asynchronous data transfer and communication with

the server : XMLHttpRequest object (XHR).

Defining Ajax The technologies,levels,languages and protocols used are

Ajax incorporates• Manipulation, transformation and data exchange:

XML, XSLT, HTML, JSON, Plain Text.• Transfer Protocol: HTTP, HTTPS.• Server-side languages: JSP, JSF, Perl, Ruby, PHP,

Cold Fusion, ASP, and CGI applications.

Defining Ajax The technologies,levels,languages and protocols used are (cont..)

Examples

Google Suggest:

Google Maps:

Examples(cont..)

Gmail Registration Yahoo! Sports

Communication usually occurs in two ways as following

Synchronous(Traditional way) Asynchronous(Ajax way)

Communication

• Classical way of connection.• Publication of information in static

web pages is good example.• The communication occurs as

1. User Http request to server

2. Server Process request (includes data retrieval and processing)

3. Returns a HTML Page to the Client

Synchronous Comm..

Synchronous Comm..(contd..)

Traditional Web interaction

Client makes http request

Web serverServer returns a new page

Asynchronous Comm..

Ajax Web Interaction

Web server

Client makes http request for specific information

Server returns the requested information

Multiple requests are served

Synchronous Comm..(Contd..)

Broken user activity and full page reload

Asynchronous Comm..(contd..)

Ajax way of Communication

Insight of Ajax Web Application

• Ajax application in client side is formed of three layers • User Interface (XHTML,DOM,CSS)• Java script Code • Ajax Engine

• Object for asynchronous communication is created based on the browser used.

• Internet Explorer (ActiveX Object)• Firefox , Safari (XMLHttpRequest Object)

• XHR object sends request in asynchronous way, this request is through HTTP or HTTPS

Examples(cont..)

• Advantages• Cross-Browser and Cross-Platform Compatibility.• Ajax application can be build with open standards

technologies, is not tied to proprietary software.• Lower cost of development.• The code can be optimized and separated.• More rich interaction with the user, by example:autocomplete, drag

and drop, transparency, shading, Z-ordering, etc.• More speed, and less wait time for screen updated.• Widespread adoption of Ajax by industry leaders.• Integration with others proprietaries technologies.

Features: Advantages

• Disadvantages• Same security problems as in classic Web applications.• Think of different way in the development and design.• The use of frameworks can generate complexity.• More interaction through JavaScript.• More code for old browser.• Special code for some functions of Internet Explorer.

Features : Disadvantages

Who’s Using Ajax?

• E-mails, calendars, spreadsheets, information managers,

and word processors, are migrating of the traditional installation

of programs in local desktop, towards Ajax Web applications.• These Ajax applications have the similar interactivity and speed as desktop

programs. The Ajax Web applications are producing radically changes towards a new Internet age. New, better, useful and successful

applications based on Ajax, are near.• It is necessary to understand and have some research how Ajax is working

inside its new paradigms.

Conclusions

THANK YOU!