Barcamp03 Slides

388 views
343 views

Published on

Push Techonology for Real Time Web

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
388
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Barcamp03 Slides

  1. 1. Push Technology for Real Time Web by LowerMyBid.com <ul><li>Case study: LowerMyBid.com web site </li></ul>
  2. 2. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What are the functionalities of the site: </li></ul><ul><li>LMB is a penny auction web site where the lowest unique bider is the winner. </li></ul>
  3. 3. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>Each time there is a new bid: </li></ul><ul><ul><li>Process the bid: </li></ul></ul><ul><ul><ul><li>Is there a new winner? </li></ul></ul></ul><ul><ul><ul><li>Update the auction time (typically +15 sec) </li></ul></ul></ul><ul><ul><ul><li>Update the bidder browser </li></ul></ul></ul><ul><ul><ul><li>Update as soon as possible all browsers </li></ul></ul></ul><ul><li>But only those connected to this auction! </li></ul>
  4. 4. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In the background: </li></ul><ul><ul><li>Process the bid's accounting: </li></ul></ul><ul><ul><ul><li>Check if the bidder has enough points to bid </li></ul></ul></ul><ul><ul><ul><li>Deduct points from bidder account </li></ul></ul></ul>
  5. 5. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In foreground: </li></ul><ul><ul><li>Update bidder browser: </li></ul></ul><ul><ul><ul><li>Show the bidder his new points available </li></ul></ul></ul><ul><ul><ul><li>Update the bidder auction box </li></ul></ul></ul><ul><li>No big deal, ajax request / response </li></ul>
  6. 6. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In foreground: </li></ul><ul><ul><li>Update all browsers (connected to this auction) </li></ul></ul><ul><ul><ul><li>Update the timer </li></ul></ul></ul><ul><ul><ul><li>Update the new winner (or killed) </li></ul></ul></ul><ul><ul><ul><li>Show that somebody has placed a bid </li></ul></ul></ul>
  7. 7. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In the background also: </li></ul><ul><ul><li>Process the auctions management: </li></ul></ul><ul><ul><ul><li>Has one auction ended? </li></ul></ul></ul><ul><ul><ul><ul><li>Verify the winner </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Process the auction closure </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Show the final winner in all browsers </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Remove the auction from all browsers after a certain period of time. </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Show it in the past auctions pannel for all browsers </li></ul></ul></ul></ul>
  8. 8. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In the background also: </li></ul><ul><ul><li>Process the auctions management: </li></ul></ul><ul><ul><ul><li>Is there a new auction to start? </li></ul></ul></ul><ul><ul><ul><ul><li>Remove it from the future auctions from all browsers </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Show the new auction in all browsers </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Start it! </li></ul></ul></ul></ul>
  9. 9. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What challenges do we have: </li></ul><ul><li>In the background also: </li></ul><ul><ul><li>If an action end with no winners: (winners was killed) </li></ul></ul><ul><ul><ul><li>Set it to restart </li></ul></ul></ul><ul><ul><ul><li>Show to all browser that the auction will restart (typically for 2 hours) </li></ul></ul></ul><ul><ul><ul><li>Restart it in all browsers </li></ul></ul></ul>
  10. 10. Push Technology for Real Time Web by LowerMyBid.com <ul><li>The major challenge is to update, as soon as possible, all interested browsers! </li></ul>
  11. 11. Push Technology for Real Time Web by LowerMyBid.com <ul><li>The major challenge is to update, as soon as possible, => IN REAL TIME all interested browsers! </li></ul>
  12. 12. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How the other penny auctions sites do this? </li></ul>
  13. 13. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How the other penny auctions sites do this? </li></ul><ul><li>(the dumb ones where you only have to click that dumb button ) </li></ul>
  14. 14. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How the other penny auctions sites do this? </li></ul><ul><li>(the dumb push that dumb button ones)? </li></ul><ul><li>They pull, pull, pull pull pull pull pull pull pull with ajax requests...... </li></ul>
  15. 15. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How the other penny auctions sites do this? </li></ul><ul><li>(the dumb push that dumb button ones)? </li></ul><ul><li>They pull, pull, pull pull pull pull pull pull pull with ajax requests...... </li></ul><ul><li>One request per second! </li></ul>
  16. 16. Push Technology for Real Time Web by LowerMyBid.com <ul><li>They pull, pull, pull pull pull pull pull pull pull </li></ul>
  17. 17. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What one request per second means: </li></ul><ul><ul><li>Heavy traffic </li></ul></ul><ul><ul><li>Heavy load on the server </li></ul></ul><ul><ul><li>And most important: </li></ul></ul><ul><li>Over one second of lag (typically 1.5sec) </li></ul>
  18. 18. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How are we updating in real time? </li></ul><ul><li>PUSH TECHNOLOGY </li></ul>
  19. 19. Push Technology for Real Time Web by LowerMyBid.com <ul><li>PUSH TECHNOLOGY </li></ul>
  20. 20. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What's better? </li></ul>
  21. 21. Push Technology for Real Time Web by LowerMyBid.com <ul><li>We only use HTTP ajax request when there is a user action: </li></ul><ul><li>New page load, </li></ul><ul><ul><li>we pull the auction time from servers </li></ul></ul><ul><li>User place a bid </li></ul><ul><ul><li>We send the bid </li></ul></ul><ul><ul><li>We update his bid box to let him place a new bid, update his points available & the list of bids he placed </li></ul></ul>
  22. 22. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What do we push? </li></ul><ul><ul><li>After a bid is placed: </li></ul></ul><ul><ul><ul><li>We update the auction parameters (winner, price etc..) </li></ul></ul></ul><ul><ul><ul><li>We update the timers variables each time the time change </li></ul></ul></ul><ul><li>We only send the data when a bid is placed! </li></ul>
  23. 23. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What else do we push? </li></ul><ul><ul><li>For a new auction </li></ul></ul><ul><ul><ul><li>We push a new partial for the new auction </li></ul></ul></ul><ul><ul><ul><li>We set the auction variables </li></ul></ul></ul><ul><ul><ul><li>We remove the future auction partial </li></ul></ul></ul><ul><li>We only send the data when there is a new auction! </li></ul>
  24. 24. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What else do we push? </li></ul><ul><ul><li>For a closed auction </li></ul></ul><ul><ul><ul><li>We push the closed auction parameters </li></ul></ul></ul><ul><ul><ul><li>We wait a bit (for now 1 minute) </li></ul></ul></ul><ul><ul><ul><li>We then remove closed auction </li></ul></ul></ul><ul><ul><ul><li>We place that auction in the close auctions pannel. </li></ul></ul></ul>
  25. 25. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What else do we push? </li></ul><ul><ul><li>For a no winner auction (killed) </li></ul></ul><ul><ul><ul><li>We push the new time in the auction panel </li></ul></ul></ul><ul><ul><ul><li>We wait a few seconds </li></ul></ul></ul><ul><ul><ul><li>We then restart the auction </li></ul></ul></ul>
  26. 26. Push Technology for Real Time Web by LowerMyBid.com <ul><li>What can we do with real time push? </li></ul><ul><li>We can do whatever we want on the user side </li></ul><ul><li>(do I hear God?) </li></ul>
  27. 27. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How are we doing this? </li></ul><ul><ul><li>We push full RJS templates (site is in Rails) </li></ul></ul><ul><ul><li>We push pure ajax code </li></ul></ul><ul><ul><li>We address the Javascript variables </li></ul></ul>
  28. 28. Push Technology for Real Time Web by LowerMyBid.com <ul><li>How is this setup: </li></ul>Web server Database Push server Stream server User Browser
  29. 29. Push Technology for Real Time Web by LowerMyBid.com <ul><li>BID: </li></ul>Web server Database Push server Stream server User Browser 1 Ajax request 3 Ajax response 2 web server send broadcast in real time 2.1 Pushed real time to browsers
  30. 30. Push Technology for Real Time Web by LowerMyBid.com <ul><li>Auctions monitoring: </li></ul>Web server Database Push server Stream server User Browser 1 Monitor continuously the DB 2 monitor web server 3.1 Pushed real time to browsers 3 send broadcast in real time
  31. 31. Push Technology for Real Time Web by LowerMyBid.com <ul><li>Auctions update: </li></ul>Web server Database Push server Stream server User Browser 1 send request to web server 2 web server send broadcast in real time 2.1 Pushed real time to browsers Web server acknowledge
  32. 32. Push Technology for Real Time Web by LowerMyBid.com <ul><li>Thank you. </li></ul><ul><li>To contact me: </li></ul><ul><li>Facebook: http://www.facebook.com/pages/LowerMyBid/252681494095 </li></ul><ul><li>Twitter: @lowermybid </li></ul>

×