P1246211300aeSWw

1
AJAX AJAJ AJAH
Pushing Techniques
Presented by Ben Novakovic
2
What is AJAX?

• Who really knows?
• AJAX refers to a set of techniques commonly used
  to make web applications more interactive
• Additional data fetched on the fly
• How?

3
How AJAX works

• A XMLHTTPRequest Javascript Object is used
• Specify URL, key/val params and method
• Getting the retrived data?

var xmlhttp new XMLHttpRequest() xmlhttp.open('
GET', 'rpc.php', true) xmlhttp.send(null)
4
Fetched AJAX Data

• The use of the onReadyStateChange attribute is
  used as a callback once the request is finished
• The callback is a function specified elsewhere
  that is executed.

var xmlhttp new XMLHttpRequest() xmlhttp.onread
ystatechange callbackHandler xmlhttp.open('GET'
, 'rpc.php', true) xmlhttp.send(null)
5
So why use AJAX?

• To increase interactivity with normally static
  websites.
• Keep the user informed with small pieces of data
  rather than heavy page reloads
• Because its not flash!

6
Case Study

• An in-browser chat application
• Challenges
• Unpredictable responses
• Scaleability
• Keeping the UI interactive

7
Methods of AJAX data interchange

• Three common methods, 1 not so common method
• Common
• Polling
• Long-polling (buzzword comet)?
• Not so common
• Pushing

8
Method 1 Polling

• Polling is the most common method
• Client asks server for updates at a predetermined
  interval.

9
Advantages/Disadvantages of Polling

• Easy to implement
• Suits some scenarios

• Requires client to ask for updates
• Polls may fall outside of HTTP Keep-alive window
• Slow!

10
(No Transcript)
11
Method 2 Long-Polling

• Eh? Isn't this the same?
• Less common than traditional polling, but
  becoming more popular
• Client asks server for and update, when the
  server has data to send, it will 'push' it down
  to the client
• Meebo and Facebook use this method

12
Advantages/Disadvantages of Long-Polling

• Client gets updated when it needs to be
• utilization of HTTP Keep-alive window
• Fast!

• if implemented incorrectly, can suffer from
  'twitter' syndrome
• trickier to maintain server state.
• potential to lose data between requests

13
(No Transcript)
14
Method 3 Pushing

• Sounds very much like long-polling, but isn't
• Least common of the lot due to browser woes
• Client asks server to be updated using
  'multipart' HTTP header, server sees header and
  keeps connection open, even after updates are sent

15
Advantages/Disadvantages of Pushing

• Client gets updated when it needs to be
• can reuse connection
• less chance of data loss
• Very Fast!

• very tricky to implement
• only Mozilla browsers support it
• hard to scale
• impossible to know when connection dies

16
(No Transcript)
17
Advantages/Disadvantages of Pushing

• Client gets updated when it needs to be
• can reuse connection
• less chance of data loss
• Very Fast!

• very tricky to implement
• only Mozilla browsers support it
• hard to scale
• impossible to know when connection dies

18
Note to Ben

• Show code demo before continuing

19
So which is best?

• How long is a piece of string?
• Weigh up the requirements and scalability issues
  with each before making your decision.
• Costly to change between methods once dev has
  started
• Pushing on the roadmap for Webkit

20
Questions