Welcome
For web application retrieving data from server as per users
selection is a very common task.
Like user selects name of some State and to retrieve name
of all the Cities for the given state.
We will discuss same scenario in our today’s meeting.
Main motto of this discussion is to come up with some thing
new which can help us to reduce load on server as well as
reduce network traffic.
1
Options Available
For doing this there are various options available we will be
discussing following three.
Traditional Way.
Submitting the page to server and asking for data.
Like it is there in Ultimatix.
AJAX
A background request is submitted to server and data is
retrieved from server.
2
Illustration
Example
Traditional Approach
In this when ever value of state is changed the page is
submitted back to the server where some processing is
done and response is return back to the browser.
Lots of processes are done to accomplish this simple
task. Like
Sending request to server
Processing request received
Returning back entire page and re rendering it in
browser.
3
4
Illustration - Contd
XML Data Islands
An XML data island is Extensible Markup Language (XML) embedded in an HTML document.
How it works:
In simple words Xml data islands is data in xml format rendered in browser with xml tags along with
other html tags.
Data is embedded in browser itself so no need to query server for the same.
Load it in javascript object and process it
This approach is faster then the traditional one however it has its own limitations.
Following browser support xml data islands
Internet Explorer 5+
Firefox 1.0.2
Mozilla 1.7.8
Opera 8
Netscape 6
Further Readings
Browser Support and other details
5
Illustration - Contd
Asynchronous JavaScript and XML, or Ajax, is a web development technique for
creating interactive web applications using a combination of:
XHTML (or HTML) and CSS for marking up and styling information
The Document Object Model manipulated through JavaScript to dynamically
display and interact with the information presented
The XMLHttpRequest object to exchange data asynchronously with the web
server. (XML is commonly used, although any format will work, including
preformatted HTML, plain text, JSON and even EBML). In some Ajax
frameworks and in some situations, an IFrame object is used instead of the
XMLHttpRequest object to exchange data with the web server.
6
Illustration – Contd
AJAX
In case of AJAX one back ground request is created and submitted to the server.
Server then processes the request and returns its reponse.
The main difference between traditional and AJAX approach is that the page is not recreated again
which helps in reducing server processing as well as netword traffic
Following browser support AJAX
Apple Safari 1.2 and above
Konqueror
Microsoft Internet Explorer 5.0+
Mozilla/Mozilla Firefox 1.0 and above
Netscape 7.1 and above
Opera 7.6 and above
Opera Mobile Browser 8.0 and above
Further Reading
Ajax Sample
AJAX in Detail
HMIS Example
